element-plus/es/hooks/use-teleport/index.mjs.map

A Component Library for Vue 3

{"version":3,"file":"index.mjs","names":[],"sources":["../../../../../packages/hooks/use-teleport/index.ts"],"sourcesContent":["import { Teleport, h, onUnmounted, ref } from 'vue'\nimport {\n  NOOP,\n  createGlobalNode,\n  isClient,\n  removeGlobalNode,\n} from '@element-plus/utils'\n\nimport type { Ref, VNode } from 'vue'\n\nexport const useTeleport = (\n  contentRenderer: () => VNode,\n  appendToBody: Ref<boolean>\n) => {\n  const isTeleportVisible = ref(false)\n\n  if (!isClient) {\n    return {\n      isTeleportVisible,\n      showTeleport: NOOP,\n      hideTeleport: NOOP,\n      renderTeleport: NOOP,\n    }\n  }\n\n  let $el: HTMLElement | null = null\n\n  const showTeleport = () => {\n    isTeleportVisible.value = true\n    // this allows the delayed showing strategy since the the content itself could be enterable\n    // e.g. el-popper\n    if ($el !== null) return\n\n    $el = createGlobalNode()\n  }\n\n  const hideTeleport = () => {\n    isTeleportVisible.value = false\n    if ($el !== null) {\n      removeGlobalNode($el)\n      $el = null\n    }\n  }\n\n  const renderTeleport = () => {\n    return appendToBody.value !== true\n      ? contentRenderer()\n      : isTeleportVisible.value\n        ? [h(Teleport, { to: $el }, contentRenderer())]\n        : undefined\n  }\n\n  onUnmounted(hideTeleport)\n\n  return {\n    isTeleportVisible,\n    showTeleport,\n    hideTeleport,\n    renderTeleport,\n  }\n}\n"],"mappings":";;;;;AAUA,MAAa,eACX,iBACA,iBACG;CACH,MAAM,oBAAoB,IAAI,MAAM;CAEpC,IAAI,CAAC,UACH,OAAO;EACL;EACA,cAAc;EACd,cAAc;EACd,gBAAgB;EACjB;CAGH,IAAI,MAA0B;CAE9B,MAAM,qBAAqB;EACzB,kBAAkB,QAAQ;EAG1B,IAAI,QAAQ,MAAM;EAElB,MAAM,kBAAkB;;CAG1B,MAAM,qBAAqB;EACzB,kBAAkB,QAAQ;EAC1B,IAAI,QAAQ,MAAM;GAChB,iBAAiB,IAAI;GACrB,MAAM;;;CAIV,MAAM,uBAAuB;EAC3B,OAAO,aAAa,UAAU,OAC1B,iBAAiB,GACjB,kBAAkB,QAChB,CAAC,EAAE,UAAU,EAAE,IAAI,KAAK,EAAE,iBAAiB,CAAC,CAAC,GAC7C,KAAA;;CAGR,YAAY,aAAa;CAEzB,OAAO;EACL;EACA;EACA;EACA;EACD"}