import { defineComponent, shallowRef, onMounted, nextTick, watch, onUnmounted, createVNode, Transition, withDirectives, vShow } from 'vue';
import '../../../utils/index.mjs';
import { windowIsUndefined, dataToArray } from './utils.mjs';
import { drawerChildProps } from './props.mjs';
import { KeyCode } from '../../../utils/KeyCode.mjs';
import { classNames } from '../../../utils/dom/class.mjs';
import { omit } from '../../../utils/lang/omit.mjs';

const currentDrawer = {};
var Child = /* @__PURE__ */ defineComponent({
  compatConfig: {
    MODE: 3
  },
  inheritAttrs: false,
  name: "DrawerChild",
  props: drawerChildProps(),
  emits: ["close", "handleClick", "change"],
  setup(props, {
    emit,
    slots
  }) {
    const contentWrapper = shallowRef();
    const dom = shallowRef();
    const maskDom = shallowRef();
    const handlerDom = shallowRef();
    const contentDom = shallowRef();
    let levelDom = [];
    const drawerId = `drawer_id_${Number((Date.now() + Math.random()).toString().replace(".", Math.round(Math.random() * 9).toString())).toString(16)}`;
    const getLevelDom = ({
      level,
      getContainer
    }) => {
      if (windowIsUndefined)
        return;
      const container = getContainer == null ? void 0 : getContainer();
      const parent = container ? container.parentNode : null;
      levelDom = [];
      if (level === "all") {
        const children = parent ? Array.prototype.slice.call(parent.children) : [];
        children.forEach((child) => {
          if (child.nodeName !== "SCRIPT" && child.nodeName !== "STYLE" && child.nodeName !== "LINK" && child !== container)
            levelDom.push(child);
        });
      } else if (level) {
        dataToArray(level).forEach((key) => {
          document.querySelectorAll(key).forEach((item) => {
            levelDom.push(item);
          });
        });
      }
    };
    const domFocus = () => {
      var _a, _b;
      (_b = (_a = dom.value) == null ? void 0 : _a.focus) == null ? void 0 : _b.call(_a);
    };
    onMounted(() => {
      nextTick(() => {
        var _a;
        const {
          open,
          getContainer,
          showMask,
          autofocus
        } = props;
        const container = getContainer == null ? void 0 : getContainer();
        getLevelDom(props);
        if (open) {
          if (container && container.parentNode === document.body)
            currentDrawer[drawerId] = open;
          nextTick(() => {
            if (autofocus)
              domFocus();
          });
          if (showMask)
            (_a = props.scrollLocker) == null ? void 0 : _a.lock();
        }
      });
    });
    watch(() => props.level, () => {
      getLevelDom(props);
    }, {
      flush: "post"
    });
    watch(() => props.open, () => {
      const {
        open,
        getContainer,
        scrollLocker,
        showMask,
        autofocus
      } = props;
      const container = getContainer == null ? void 0 : getContainer();
      if (container && container.parentNode === document.body)
        currentDrawer[drawerId] = !!open;
      if (open) {
        if (autofocus)
          domFocus();
        if (showMask)
          scrollLocker == null ? void 0 : scrollLocker.lock();
      } else {
        scrollLocker == null ? void 0 : scrollLocker.unLock();
      }
    }, {
      flush: "post"
    });
    onUnmounted(() => {
      var _a;
      const {
        open
      } = props;
      delete currentDrawer[drawerId];
      if (open)
        document.body.style.touchAction = "";
      (_a = props.scrollLocker) == null ? void 0 : _a.unLock();
    });
    watch(() => props.placement, (val) => {
      if (val) {
        contentDom.value = null;
      }
    });
    const onClose = (e) => {
      emit("close", e);
    };
    const onKeyDown = (e) => {
      if (e.keyCode === KeyCode.ESC) {
        e.stopPropagation();
        onClose(e);
      }
    };
    const onAfterVisibleChange = () => {
      const {
        open,
        afterVisibleChange
      } = props;
      if (afterVisibleChange)
        afterVisibleChange(!!open);
    };
    const onHandleClick = (e) => {
      emit("handleClick", e);
    };
    const canOpen = shallowRef(false);
    watch(dom, () => {
      nextTick(() => {
        canOpen.value = true;
      });
    });
    return () => {
      const {
        open: $open,
        prefixCls,
        placement,
        showMask,
        maskClosable,
        maskStyle,
        keyboard,
        contentWrapperStyle,
        style,
        class: className,
        rootClassName,
        rootStyle,
        maskMotion,
        motion,
        inline,
        ...otherProps
      } = props;
      const open = $open && canOpen.value;
      const wrapperClassName = classNames(prefixCls, {
        [`${prefixCls}-${placement}`]: true,
        [`${prefixCls}-open`]: open,
        [`${prefixCls}-inline`]: inline,
        "no-mask": !showMask,
        [rootClassName]: true
      });
      const motionProps = typeof motion === "function" ? motion(placement) : motion;
      return createVNode("div", {
        ...omit(otherProps, ["autofocus"]),
        "tabindex": -1,
        "class": wrapperClassName,
        "style": rootStyle,
        "ref": dom,
        "onKeydown": open && keyboard ? onKeyDown : void 0
      }, [createVNode(Transition, maskMotion, {
        default: () => [showMask && withDirectives(createVNode("div", {
          "class": `${prefixCls}-mask`,
          "onClick": maskClosable ? onClose : void 0,
          "style": maskStyle,
          "ref": maskDom
        }, null), [[vShow, open]])]
      }), createVNode(Transition, {
        ...motionProps,
        "onAfterEnter": onAfterVisibleChange,
        "onAfterLeave": onAfterVisibleChange
      }, {
        default: () => {
          var _a, _b;
          return [withDirectives(createVNode("div", {
            "class": `${prefixCls}-content-wrapper`,
            "style": [contentWrapperStyle],
            "ref": contentWrapper
          }, [createVNode("div", {
            "class": [`${prefixCls}-content`, className],
            "style": style,
            "ref": contentDom
          }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]), slots.handler ? createVNode("div", {
            "onClick": onHandleClick,
            "ref": handlerDom
          }, [(_b = slots.handler) == null ? void 0 : _b.call(slots)]) : null]), [[vShow, open]])];
        }
      })]);
    };
  }
});

export { Child as default };
//# sourceMappingURL=DrawerChild.mjs.map
