"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const event = require("../../../constants/event.js");
const shared_esmBundler = require("../../../../../@vue/shared/dist/shared.esm-bundler.js");
const error = require("../../../utils/error.js");
const style = require("../../../utils/dom/style.js");
const index$2 = require("../../../hooks/use-namespace/index.js");
const index$3 = require("../../../hooks/use-lockscreen/index.js");
const index$1 = require("../../../hooks/use-id/index.js");
const index = require("../../../hooks/use-z-index/index.js");
const useGlobalConfig = require("../../config-provider/src/hooks/use-global-config.js");
const constants = require("./constants.js");
const Vue = require("vue");
const index$4 = require("../../../../node_modules/@vueuse/shared/index.js");
const COMPONENT_NAME = "ElDialog";
const useDialog = (props, targetRef) => {
  const emit = Vue.getCurrentInstance().emit;
  const { nextZIndex } = index.useZIndex();
  let lastPosition = "";
  const titleId = index$1.useId();
  const bodyId = index$1.useId();
  const visible = Vue.ref(false);
  const closed = Vue.ref(false);
  const rendered = Vue.ref(false);
  const zIndex = Vue.ref(props.zIndex ?? nextZIndex());
  const closing = Vue.ref(false);
  let openTimer = void 0;
  let closeTimer = void 0;
  const config = useGlobalConfig.useGlobalConfig();
  const namespace = Vue.computed(() => {
    var _a;
    return ((_a = config.value) == null ? void 0 : _a.namespace) ?? index$2.defaultNamespace;
  });
  const globalConfig = Vue.computed(() => {
    var _a;
    return (_a = config.value) == null ? void 0 : _a.dialog;
  });
  const style$1 = Vue.computed(() => {
    const style$12 = {};
    const varPrefix = `--${namespace.value}-dialog`;
    if (!props.fullscreen) {
      if (props.top) style$12[`${varPrefix}-margin-top`] = props.top;
      const width = style.addUnit(props.width);
      if (width) style$12[`${varPrefix}-width`] = width;
    }
    return style$12;
  });
  const _draggable = Vue.computed(() => {
    var _a;
    return (props.draggable ?? ((_a = globalConfig.value) == null ? void 0 : _a.draggable) ?? false) && !props.fullscreen;
  });
  const _alignCenter = Vue.computed(() => {
    var _a;
    return props.alignCenter ?? ((_a = globalConfig.value) == null ? void 0 : _a.alignCenter) ?? false;
  });
  const _overflow = Vue.computed(() => {
    var _a;
    return props.overflow ?? ((_a = globalConfig.value) == null ? void 0 : _a.overflow) ?? false;
  });
  const overlayDialogStyle = Vue.computed(() => {
    if (_alignCenter.value) return { display: "flex" };
    return {};
  });
  const transitionConfig = Vue.computed(() => {
    var _a;
    const transition = props.transition ?? ((_a = globalConfig.value) == null ? void 0 : _a.transition) ?? constants.DEFAULT_DIALOG_TRANSITION;
    const baseConfig = {
      name: transition,
      onAfterEnter: afterEnter,
      onBeforeLeave: beforeLeave,
      onAfterLeave: afterLeave
    };
    if (shared_esmBundler.isObject(transition)) {
      const config2 = { ...transition };
      const _mergeHook = (userHook, defaultHook) => {
        return (el) => {
          if (shared_esmBundler.isArray(userHook)) userHook.forEach((fn) => {
            if (shared_esmBundler.isFunction(fn)) fn(el);
          });
          else if (shared_esmBundler.isFunction(userHook)) userHook(el);
          defaultHook();
        };
      };
      config2.onAfterEnter = _mergeHook(config2.onAfterEnter, afterEnter);
      config2.onBeforeLeave = _mergeHook(config2.onBeforeLeave, beforeLeave);
      config2.onAfterLeave = _mergeHook(config2.onAfterLeave, afterLeave);
      if (!config2.name) {
        config2.name = constants.DEFAULT_DIALOG_TRANSITION;
        error.debugWarn(COMPONENT_NAME, `transition.name is missing when using object syntax, fallback to '${constants.DEFAULT_DIALOG_TRANSITION}'`);
      }
      return config2;
    }
    return baseConfig;
  });
  function afterEnter() {
    emit("opened");
  }
  function afterLeave() {
    emit("closed");
    emit(event.UPDATE_MODEL_EVENT, false);
    if (props.destroyOnClose) rendered.value = false;
    closing.value = false;
  }
  function beforeLeave() {
    closing.value = true;
    emit("close");
  }
  function open() {
    closeTimer == null ? void 0 : closeTimer();
    openTimer == null ? void 0 : openTimer();
    if (props.openDelay && props.openDelay > 0) ({ stop: openTimer } = index$4.useTimeoutFn(() => doOpen(), props.openDelay));
    else doOpen();
  }
  function close() {
    openTimer == null ? void 0 : openTimer();
    closeTimer == null ? void 0 : closeTimer();
    if (props.closeDelay && props.closeDelay > 0) ({ stop: closeTimer } = index$4.useTimeoutFn(() => doClose(), props.closeDelay));
    else doClose();
  }
  function handleClose() {
    function hide(shouldCancel) {
      if (shouldCancel) return;
      closed.value = true;
      visible.value = false;
    }
    if (props.beforeClose) props.beforeClose(hide);
    else close();
  }
  function onModalClick() {
    if (props.closeOnClickModal) handleClose();
  }
  function doOpen() {
    if (!index$4.isClient) return;
    visible.value = true;
  }
  function doClose() {
    visible.value = false;
  }
  function onOpenAutoFocus() {
    emit("openAutoFocus");
  }
  function onCloseAutoFocus() {
    emit("closeAutoFocus");
  }
  function onFocusoutPrevented(event2) {
    var _a;
    if (((_a = event2.detail) == null ? void 0 : _a.focusReason) === "pointer") event2.preventDefault();
  }
  if (props.lockScroll) index$3.useLockscreen(visible);
  function onCloseRequested() {
    if (props.closeOnPressEscape) handleClose();
  }
  Vue.watch(() => props.zIndex, () => {
    zIndex.value = props.zIndex ?? nextZIndex();
  });
  Vue.watch(() => props.modelValue, (val) => {
    if (val) {
      closed.value = false;
      closing.value = false;
      open();
      rendered.value = true;
      zIndex.value = props.zIndex ?? nextZIndex();
      Vue.nextTick(() => {
        emit("open");
        if (targetRef.value) {
          targetRef.value.parentElement.scrollTop = 0;
          targetRef.value.parentElement.scrollLeft = 0;
          targetRef.value.scrollTop = 0;
        }
      });
    } else if (visible.value) close();
  });
  Vue.watch(() => props.fullscreen, (val) => {
    if (!targetRef.value) return;
    if (val) {
      lastPosition = targetRef.value.style.transform;
      targetRef.value.style.transform = "";
    } else targetRef.value.style.transform = lastPosition;
  });
  Vue.onMounted(() => {
    if (props.modelValue) {
      visible.value = true;
      rendered.value = true;
      open();
    }
  });
  return {
    afterEnter,
    afterLeave,
    beforeLeave,
    handleClose,
    onModalClick,
    close,
    doClose,
    onOpenAutoFocus,
    onCloseAutoFocus,
    onCloseRequested,
    onFocusoutPrevented,
    titleId,
    bodyId,
    closed,
    style: style$1,
    overlayDialogStyle,
    rendered,
    visible,
    zIndex,
    transitionConfig,
    _draggable,
    _alignCenter,
    _overflow,
    closing
  };
};
exports.useDialog = useDialog;
