export const headerDividing = () => ({
  isSticky: false,
  $el: null as HTMLElement | null,
  _observer: null as IntersectionObserver | null,

  init() {
    const centerEl = this.$el as HTMLElement;
    if (!centerEl) return;

    const header = centerEl.closest('.header') as HTMLElement;

    if (!header) return;

    // 直接观察 header 元素本身
    this._observer = new IntersectionObserver(
      (entries) => {
        const entry = entries[0];
        this.isSticky = entry.boundingClientRect.top < 0 && !entry.isIntersecting;
      },
      {
        threshold: 0, // 只要有任何部分离开就触发
        rootMargin: '0px' // 无偏移
      }
    );

    this._observer.observe(header);
  },

  destroy() {
    if (this._observer) {
      this._observer.disconnect();
      this._observer = null;
    }
  }
});
