You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

47 lines
1.2 KiB

1 month ago
  1. 'use strict';
  2. Object.defineProperty(exports, '__esModule', { value: true });
  3. var vue = require('vue');
  4. var globalNode = require('../../utils/vue/global-node.js');
  5. var core = require('@vueuse/core');
  6. var shared = require('@vue/shared');
  7. const useTeleport = (contentRenderer, appendToBody) => {
  8. const isTeleportVisible = vue.ref(false);
  9. if (!core.isClient) {
  10. return {
  11. isTeleportVisible,
  12. showTeleport: shared.NOOP,
  13. hideTeleport: shared.NOOP,
  14. renderTeleport: shared.NOOP
  15. };
  16. }
  17. let $el = null;
  18. const showTeleport = () => {
  19. isTeleportVisible.value = true;
  20. if ($el !== null)
  21. return;
  22. $el = globalNode.createGlobalNode();
  23. };
  24. const hideTeleport = () => {
  25. isTeleportVisible.value = false;
  26. if ($el !== null) {
  27. globalNode.removeGlobalNode($el);
  28. $el = null;
  29. }
  30. };
  31. const renderTeleport = () => {
  32. return appendToBody.value !== true ? contentRenderer() : isTeleportVisible.value ? [vue.h(vue.Teleport, { to: $el }, contentRenderer())] : void 0;
  33. };
  34. vue.onUnmounted(hideTeleport);
  35. return {
  36. isTeleportVisible,
  37. showTeleport,
  38. hideTeleport,
  39. renderTeleport
  40. };
  41. };
  42. exports.useTeleport = useTeleport;
  43. //# sourceMappingURL=index.js.map