/* eslint-disable @typescript-eslint/ban-ts-comment */
import Vue2 from 'vue'
// @ts-ignore
import Teleport from 'vue2-teleport-polyfill'
import { Graph } from '@antv/x6'
import { VueShape } from './node'

// 存储 Teleport 动态组件的映射表（id -> Vue 组件选项）
export const teleportComponents = new Map<string, Vue.ComponentOptions<Vue>>()

let active = false
let teleportContainer: HTMLElement | null = null

// 判断当前环境是否激活了 Teleport
export function isActive() {
  return active
}

export function getTeleportContainer() {
  return teleportContainer
}

function ensureTeleportContainer(selector?: string) {
  if (selector) {
    const container = document.querySelector(selector)
    if (container) {
      return container as HTMLElement
    }
  }
  const container = document.createElement('div')
  document.body.appendChild(container)
  return container
}

// 连接 Teleport 目标（核心逻辑补充）
export function connect(
  targetId: string,
  component: Vue.Component,
  container: HTMLElement,
  node: VueShape,
  graph: Graph,
) {
  // 动态创建包含 Teleport 的 Vue2 组件
  const teleportComponent: Vue.ComponentOptions<Vue> = {
    render(h: Vue.CreateElement) {
      return h(
        Teleport,
        {
          props: { to: container },
        },
        [
          h(component, {
            props: { node, graph },
          }),
        ],
      )
    },
    provide() {
      return {
        getNode: () => node,
        getGraph: () => graph,
      }
    },
  }

  // 存储动态组件（替代原有的目标元素存储）
  teleportComponents.set(targetId, teleportComponent)
}

// 断开 Teleport 目标（调整为清理动态组件）
export function disconnect(targetId: string) {
  teleportComponents.delete(targetId) // 移除存储的动态组件
}

// 为 Vue 组件提供 Teleport 支持
export function installTeleport(VueInstance: typeof Vue2 = Vue2) {
  if (active) return
  VueInstance.component('Teleport', Teleport)
  active = true
}

export function useTeleport({
  vue,
  target,
}: {
  vue?: typeof Vue2
  target?: HTMLElement | string
} = {}): any {
  installTeleport(vue)
  teleportContainer =
    target instanceof HTMLElement ? target : ensureTeleportContainer(target)
}