"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const Vue = require("vue");
const IndexBar = require("../index-bar/IndexBar.js");
const dom = require("../utils/dom.js");
const index_esm = require("../../../@vant/use/dist/index.esm.js");
const useExpose = require("../composables/use-expose.js");
const constant = require("../utils/constant.js");
const props = require("../utils/props.js");
const create = require("../utils/create.js");
const basic = require("../utils/basic.js");
const format = require("../utils/format.js");
const [name, bem] = create.createNamespace("index-anchor");
const indexAnchorProps = {
  index: props.numericProp
};
var stdin_default = Vue.defineComponent({
  name,
  props: indexAnchorProps,
  setup(props2, {
    slots
  }) {
    const state = Vue.reactive({
      top: 0,
      left: null,
      rect: {
        top: 0,
        height: 0
      },
      width: null,
      active: false
    });
    const root = Vue.ref();
    const {
      parent
    } = index_esm.useParent(IndexBar.INDEX_BAR_KEY);
    if (!parent) {
      return;
    }
    const isSticky = () => state.active && parent.props.sticky;
    const anchorStyle = Vue.computed(() => {
      const {
        zIndex,
        highlightColor
      } = parent.props;
      if (isSticky()) {
        return basic.extend(format.getZIndexStyle(zIndex), {
          left: state.left ? `${state.left}px` : void 0,
          width: state.width ? `${state.width}px` : void 0,
          transform: state.top ? `translate3d(0, ${state.top}px, 0)` : void 0,
          color: highlightColor
        });
      }
    });
    const getRect = (scrollParent, scrollParentRect) => {
      const rootRect = index_esm.useRect(root);
      state.rect.height = rootRect.height;
      if (scrollParent === window || scrollParent === document.body) {
        state.rect.top = rootRect.top + dom.getRootScrollTop();
      } else {
        state.rect.top = rootRect.top + dom.getScrollTop(scrollParent) - scrollParentRect.top;
      }
      return state.rect;
    };
    useExpose.useExpose({
      state,
      getRect
    });
    return () => {
      const sticky = isSticky();
      return Vue.createVNode("div", {
        "ref": root,
        "style": {
          height: sticky ? `${state.rect.height}px` : void 0
        }
      }, [Vue.createVNode("div", {
        "style": anchorStyle.value,
        "class": [bem({
          sticky
        }), {
          [constant.BORDER_BOTTOM]: sticky
        }]
      }, [slots.default ? slots.default() : props2.index])]);
    };
  }
});
exports.default = stdin_default;
exports.indexAnchorProps = indexAnchorProps;
