@opentiny/vue-renderless 3.10.7 → 3.11.0

package/common/deps/popup-manager.js

@@ -1,7 +1,6 @@
-import "../../chunk-PKUHTIDK.js";
+import "../../chunk-G2ADBYYC.js";
 import { KEY_CODE } from "../index";
 import { addClass, removeClass, on } from "./dom";
-let hasModal = false;
 const isServer = typeof window === "undefined";
 const instances = {};
 const classes = {
@@ -22,15 +21,37 @@ const PopupManager = {
   step: 2,
   zIndex: 2e3,
   globalScroll: false,
+  // 是否打开全局滚动监听
   modalFade: true,
   modalStack: [],
+  modalDom: null,
+  // 当前model挂载的div.
+  hasModal: false,
+  // 当前是否有Modal
+  popLockClass: "popup-parent--hidden",
+  oldBodyBorder: "",
+  viewportWindow: null,
+  fixBodyBorder() {
+    const barWidth = window.innerWidth - document.documentElement.clientWidth;
+    if (barWidth) {
+      this.oldBodyBorder = document.documentElement.style.borderRight;
+      document.body.style.borderRight = `${barWidth}px solid transparent`;
+    }
+  },
+  resetBodyBorder() {
+    document.body.style.borderRight = this.oldBodyBorder;
+    this.oldBodyBorder = "";
+  },
+  /** 全局反注册 */
   deregister: (id) => {
     if (id) {
       instances[id] = null;
       delete instances[id];
     }
   },
+  /** 返回全局实例 */
   getInstance: (id) => instances[id],
+  /** 全局注册   仅vue-popup.ts中使用，instance就是vm, 把vm注册到 vm._popupId 这个键值上 */
   register: (id, instance) => {
     if (id && instance) {
       instances[id] = instance;
@@ -41,6 +62,7 @@ const PopupManager = {
     PopupManager.zIndex += PopupManager.step;
     return zIndex;
   },
+  /** 打开遮罩层， 仅vue-popup.ts中使用。 dom = vm.$el 或者 undefined (appendtoBody时)  */
   openModal(id, zIndex, dom, modalClass, modalFade) {
     if (isServer) {
       return;
@@ -49,16 +71,15 @@ const PopupManager = {
       return;
     }
     this.modalFade = modalFade;
-    const modalStack = this.modalStack;
-    for (let i = 0, len = modalStack.length; i < len; i++) {
-      const modal = modalStack[i];
+    for (let i = 0, len = this.modalStack.length; i < len; i++) {
+      const modal = this.modalStack[i];
       if (modal.id === id) {
         return;
       }
     }
     const modalDom = getModal();
     addClass(modalDom, classes.modal);
-    if (this.modalFade && !hasModal) {
+    if (this.modalFade && !PopupManager.hasModal) {
       addClass(modalDom, classes.enter);
     }
     if (modalClass) {
@@ -68,6 +89,11 @@ const PopupManager = {
     setTimeout(() => {
       removeClass(modalDom, classes.enter);
     }, 200);
+    if (zIndex) {
+      modalDom.style.zIndex = zIndex.toString();
+    }
+    modalDom.style.display = "";
+    modalDom.tabIndex = 0;
     let parentNode;
     if (dom && dom.parentNode && dom.parentNode.nodeType !== 11) {
       parentNode = dom.parentNode;
@@ -75,13 +101,9 @@ const PopupManager = {
       parentNode = document.body;
     }
     parentNode.appendChild(modalDom);
-    if (zIndex) {
-      modalDom.style.zIndex = zIndex;
-    }
-    modalDom.style.display = "";
-    modalDom.tabIndex = 0;
     this.modalStack.push({ id, zIndex, modalClass });
   },
+  /** 点击背景遮罩层时，调用栈顶的popup，调用它的close() */
   doOnModalClick: () => {
     const modalStack = PopupManager.modalStack;
     const topPopup = modalStack[modalStack.length - 1];
@@ -106,7 +128,7 @@ const PopupManager = {
         modalStack.pop();
         const stackSize = modalStack.length;
         if (stackSize > 0) {
-          modalDom.style.zIndex = modalStack[stackSize - 1].zIndex;
+          modalDom.style.zIndex = modalStack[stackSize - 1].zIndex.toString();
         }
       } else {
         removeStack(modalStack, id);
@@ -114,13 +136,15 @@ const PopupManager = {
     }
     if (modalStack.length === 0) {
       this.modalFade && addClass(modalDom, classes.leave);
+      removeClass(document.body, this.popLockClass);
+      this.resetBodyBorder();
       setTimeout(() => {
         if (modalStack.length === 0) {
           if (modalDom.parentNode) {
             modalDom.parentNode.removeChild(modalDom);
           }
           modalDom.style.display = "none";
-          PopupManager.modalDom = void 0;
+          PopupManager.modalDom = null;
         }
         removeClass(modalDom, classes.leave);
       }, 200);
@@ -129,13 +153,13 @@ const PopupManager = {
 };
 getModal = () => {
   if (isServer) {
-    return;
+    return null;
   }
   let modalDom = PopupManager.modalDom;
   if (modalDom) {
-    hasModal = true;
+    PopupManager.hasModal = true;
   } else {
-    hasModal = false;
+    PopupManager.hasModal = false;
     modalDom = document.createElement("div");
     PopupManager.modalDom = modalDom;
     modalDom.addEventListener(
@@ -147,34 +171,29 @@ getModal = () => {
       { passive: true }
     );
     on(modalDom, "click", () => {
-      PopupManager.doOnModalClick && PopupManager.doOnModalClick();
+      PopupManager.doOnModalClick();
     });
   }
   return modalDom;
 };
-const getTopPopup = () => {
-  if (isServer) {
-    return;
-  }
-  const modalStack = PopupManager.modalStack;
-  if (modalStack.length > 0) {
-    const topPopup = modalStack[modalStack.length - 1];
-    if (!topPopup) {
-      return;
-    }
-    const instance = PopupManager.getInstance(topPopup.id);
-    return instance;
-  }
-};
 if (!isServer) {
   on(window, "keydown", (event) => {
     if (event.keyCode === KEY_CODE.Escape) {
-      const topPopup = getTopPopup();
-      if (topPopup && topPopup.closeOnPressEscape) {
-        if (topPopup.handleClose) {
-          topPopup.handleClose("esc");
-        } else {
-          topPopup.handleAction ? topPopup.handleAction("cancel") : topPopup.close();
+      const modalStack = PopupManager.modalStack;
+      if (modalStack.length > 0) {
+        const topPopup = modalStack[modalStack.length - 1];
+        if (!topPopup) {
+          return;
+        }
+        const topPopupVm = PopupManager.getInstance(topPopup.id);
+        if (topPopupVm && topPopupVm.closeOnPressEscape) {
+          if (topPopupVm.handleClose) {
+            topPopupVm.handleClose("esc");
+          } else if (topPopupVm.handleAction) {
+            topPopupVm.handleAction("cancel");
+          } else {
+            topPopupVm.close();
+          }
         }
       }
     }

package/common/deps/repeat-click.js

@@ -1,4 +1,4 @@
-import "../../chunk-PKUHTIDK.js";
+import "../../chunk-G2ADBYYC.js";
 import { on, once } from "./dom";
 var repeat_click_default = (el, binding) => {
   let interval = null;

package/common/deps/requestAnimationFrame.js

@@ -7,7 +7,7 @@
   }
   if (!window.requestAnimationFrame) {
     window.requestAnimationFrame = function(callback) {
-      const now = new Date().getTime();
+      const now = (/* @__PURE__ */ new Date()).getTime();
       const timeToCall = Math.max(0, 16 - (now - lastTime));
       const timeCallback = now + timeToCall;
       const id = window.setTimeout(() => {

package/common/deps/resize-event.js

@@ -1,4 +1,4 @@
-import "../../chunk-PKUHTIDK.js";
+import "../../chunk-G2ADBYYC.js";
 import ResizeObserver from "./ResizeObserver";
 const isServer = typeof window === "undefined";
 const cacheKey = "__resizeListeners__";

package/common/deps/scroll-into-view.js

@@ -1,4 +1,4 @@
-import "../../chunk-PKUHTIDK.js";
+import "../../chunk-G2ADBYYC.js";
 const isServer = typeof window === "undefined";
 var scroll_into_view_default = (container, selected) => {
   if (isServer) {

package/common/deps/scrollbar-width.js

@@ -1,4 +1,4 @@
-import "../../chunk-PKUHTIDK.js";
+import "../../chunk-G2ADBYYC.js";
 let scrollBarWidth;
 const isServer = typeof window === "undefined";
 function scrollbar_width_default() {

package/common/deps/throttle.js

@@ -1,4 +1,4 @@
-import "../../chunk-PKUHTIDK.js";
+import "../../chunk-G2ADBYYC.js";
 function throttle_default(delay, noTrailing, callback, debounceMode) {
   let timeoutID;
   let lastExec = 0;
@@ -9,10 +9,10 @@ function throttle_default(delay, noTrailing, callback, debounceMode) {
   }
   function wrapper() {
     const me = this;
-    const elapsed = new Date().valueOf() - lastExec;
+    const elapsed = (/* @__PURE__ */ new Date()).valueOf() - lastExec;
     const args = arguments;
     function exec() {
-      lastExec = new Date().valueOf();
+      lastExec = (/* @__PURE__ */ new Date()).valueOf();
       callback.apply(me, args);
     }
     function clear() {

package/common/deps/touch.js

@@ -1,4 +1,4 @@
-import "../../chunk-PKUHTIDK.js";
+import "../../chunk-G2ADBYYC.js";
 const MIN_DISTANCE = 10;
 function getDirection(w, h) {
   if (h > w && h > MIN_DISTANCE) {
@@ -29,6 +29,7 @@ const touchMove = (state) => (event) => {
   state.direction = state.direction || getDirection(state.offsetX, state.offsetY);
 };
 export {
+  getDirection,
   resetTouchStatus,
   touchMove,
   touchStart

package/common/deps/tree-model/node.js

@@ -1,4 +1,4 @@
-import "../../../chunk-PKUHTIDK.js";
+import "../../../chunk-G2ADBYYC.js";
 import { merge } from "../../object";
 import { markNodeData, NODE_KEY } from "./util";
 import { indexOf } from "../../array";

package/common/deps/tree-model/tree-store.js

@@ -1,7 +1,7 @@
 import {
   __spreadProps,
   __spreadValues
-} from "../../../chunk-PKUHTIDK.js";
+} from "../../../chunk-G2ADBYYC.js";
 import { hasOwn, isNull } from "../../type";
 import { getNodeKey } from "./util";
 import Node from "./node";

package/common/deps/tree-model/util.js

@@ -1,4 +1,4 @@
-import "../../../chunk-PKUHTIDK.js";
+import "../../../chunk-G2ADBYYC.js";
 const NODE_KEY = "$treeNodeId";
 const getNodeKey = function(key, data) {
   if (!key) {

package/common/deps/upload-ajax.js

@@ -1,4 +1,4 @@
-import "../../chunk-PKUHTIDK.js";
+import "../../chunk-G2ADBYYC.js";
 import { hasOwn } from "../type";
 import { xss } from "../xss";
 const getBody = (xhr) => {

package/common/deps/vue-emitter.js

@@ -1,4 +1,4 @@
-import "../../chunk-PKUHTIDK.js";
+import "../../chunk-G2ADBYYC.js";
 var vue_emitter_default = (vm) => {
   const broadcast = (vm2, componentName, eventName, params) => {
     vm2.$children.forEach((child) => {

package/common/deps/vue-popper.js

@@ -1,14 +1,17 @@
 import {
   __spreadValues
-} from "../../chunk-PKUHTIDK.js";
+} from "../../chunk-G2ADBYYC.js";
 import PopupManager from "./popup-manager";
 import PopperJS from "./popper";
-import { on, off } from "./dom";
-const stop = (e) => {
-  e.stopPropagation();
-};
+import { on } from "./dom";
+const stop = (e) => e.stopPropagation();
 const isServer = typeof window === "undefined";
-const getReference = ({ state, props, refs, slots }) => {
+const getReference = ({
+  state,
+  props,
+  refs,
+  slots
+}) => {
   let reference = state.referenceElm || props.reference || refs.reference && refs.reference.$el || refs.reference;
   if (!reference && slots.reference && slots.reference()[0]) {
     state.referenceElm = slots.reference()[0].elm || slots.reference()[0].el;
@@ -16,221 +19,83 @@ const getReference = ({ state, props, refs, slots }) => {
   }
   return reference;
 };
-const getReferMaxZIndex = (reference) => {
-  var _a;
-  if (!reference || !reference.nodeType) {
-    return;
-  }
-  let getZIndex = (dom) => parseInt(window.getComputedStyle(dom).zIndex, 10) || 0;
-  let max = getZIndex(reference);
-  let z;
-  while (reference !== document.body && ((_a = reference == null ? void 0 : reference.parentNode) == null ? void 0 : _a.nodeType) !== 11 && reference.parentNode) {
-    reference = reference.parentNode;
-    z = getZIndex(reference);
-    max = Math.max(z, max);
-  }
-  return `${max + 1}`;
-};
-const appendPopper = ({ options, props, state, parent }) => {
-  if (props.appendToBody || props.popperAppendToBody) {
-    document.body.appendChild(state.popperElm);
-  } else {
-    parent && parent.$el && parent.$el.appendChild(state.popperElm);
-    options.forceAbsolute = true;
-  }
-};
-const setWatchFn = ({
-  watch,
-  props,
-  state,
-  emit,
-  nextTick,
-  updatePopper,
-  destroyPopper,
-  onBeforeUnmount,
-  onDeactivated,
-  doDestroy
-}) => {
-  watch(
-    () => props.modelValue,
-    (val) => {
-      if (props.trigger === "manual") {
-        state.showPopper = val;
-        emit("update:modelValue", val);
-      }
-    }
-  );
-  watch(
-    () => state.showPopper,
-    (val) => {
-      if (props.disabled) {
-        return;
-      }
-      val ? nextTick(updatePopper) : destroyPopper();
-      props.trigger === "manual" && emit("update:modelValue", val);
-    }
-  );
-  const removeBodyElm = () => {
-    if (state.popperElm && state.popperElm.parentNode === document.body) {
-      off(state.popperElm, "click", stop);
-      document.body.removeChild(state.popperElm);
-    }
-  };
-  onBeforeUnmount(() => {
-    nextTick(() => {
-      doDestroy(true);
-      removeBodyElm();
-    });
-  });
-  onDeactivated(() => {
-    doDestroy(true);
-    removeBodyElm();
-  });
-};
-const createPopperFn = ({
-  state,
-  props,
-  refs,
-  slots,
-  appendArrow,
-  emit,
-  resetTransformOrigin,
-  nextTick,
-  updatePopper,
-  nextZIndex,
-  parent,
-  followHide
-}) => (dom) => {
-  if (isServer) {
-    return;
-  }
-  state.currentPlacement = state.currentPlacement || props.placement;
-  if (!/^(top|bottom|left|right)(-start|-end)?$/g.test(state.currentPlacement)) {
-    return;
-  }
-  const options = props.popperOptions || { gpuAcceleration: false };
-  state.popperElm = state.popperElm || props.popper || refs.popper || dom;
-  const popper = state.popperElm;
-  let reference = getReference({ state, props, refs, slots });
-  if (!popper || !reference || reference.nodeType !== Node.ELEMENT_NODE) {
-    return;
-  }
-  if (props.visibleArrow) {
-    appendArrow(popper);
-  }
-  appendPopper({ options, props, state, parent });
-  if (props.popperJS && state.popperJS.destroy) {
-    state.popperJS.destroy();
-  }
-  options.placement = state.currentPlacement;
-  options.offset = props.offset || 0;
-  options.arrowOffset = props.arrowOffset || 0;
-  options.adjustArrow = props.adjustArrow || false;
-  state.popperJS = new PopperJS(reference, popper, options);
-  state.popperJS.onCreate(() => {
-    emit("created", state);
-    resetTransformOrigin();
-  });
-  if (typeof options.onUpdate === "function") {
-    state.popperJS.onUpdate(options.onUpdate);
-  }
-  state.popperJS._popper.style.zIndex = nextZIndex(state.popperJS._reference);
-  followHide(state.popperJS);
-  on(state.popperElm, "click", stop);
-};
-const appendArrowFn = (state) => (el) => {
-  var _a;
-  let hash;
-  if (state.appended) {
-    return;
-  }
-  state.appended = true;
-  for (const item in el.attributes) {
-    if ((_a = el.attributes[item].name) == null ? void 0 : _a.startsWith("_v-")) {
-      hash = el.attributes[item].name;
-      break;
-    }
-  }
-  const div = document.createElement("div");
-  if (hash) {
-    div.setAttribute(hash, "");
-  }
-  div.setAttribute("x-arrow", "");
-  div.className = "popper__arrow";
-  el.appendChild(div);
-};
-const resetTransformOriginFn = (state, props) => () => {
-  if (!props.transformOrigin) {
-    return;
-  }
-  const placementMap = { top: "bottom", bottom: "top", left: "right", right: "left" };
-  const placement = state.popperJS._popper.getAttribute("x-placement").split("-")[0];
-  const origin = placementMap[placement];
-  if (typeof props.transformOrigin === "string") {
-    state.popperJS._popper.style.transformOrigin = props.transformOrigin;
-  } else {
-    state.popperJS._popper.style.transformOrigin = ["top", "bottom"].includes(placement) ? `center ${origin}` : `${origin} center`;
-  }
-};
-var vue_popper_default = ({
-  parent,
-  emit,
-  nextTick,
-  onBeforeUnmount,
-  onDeactivated,
-  props,
-  watch,
-  reactive,
-  refs,
-  slots,
-  toRefs
-}) => {
+var vue_popper_default = (options) => {
+  const { parent, emit, nextTick, onBeforeUnmount, onDeactivated, props, watch, reactive, refs, slots, toRefs } = options;
   const state = reactive({
     popperJS: null,
     appended: false,
+    // arrow 是否添加
     popperElm: null,
     showPopper: props.manual ? Boolean(props.modelValue) : false,
     referenceElm: null,
     currentPlacement: ""
   });
-  const nextZIndex = (reference) => props.zIndex === "relative" ? getReferMaxZIndex(reference) : PopupManager.nextZIndex();
-  const appendArrow = appendArrowFn(state);
-  const resetTransformOrigin = resetTransformOriginFn(state, props);
+  const appendArrow = (el) => {
+    if (state.appended) {
+      return;
+    }
+    state.appended = true;
+    const div = document.createElement("div");
+    div.setAttribute("x-arrow", "");
+    div.className = "popper__arrow";
+    el.appendChild(div);
+  };
   const followHide = (popperInstance) => {
-    const { popperOptions = {} } = props;
-    const { followReferenceHide = true } = popperOptions;
+    var _a;
+    const followReferenceHide = ((_a = props == null ? void 0 : props.popperOptions) == null ? void 0 : _a.followReferenceHide) || true;
     const { _popper: popper, _reference: reference } = popperInstance;
     if (followReferenceHide && getComputedStyle(reference).position !== "fixed" && reference.offsetParent === null) {
       popper.style.display = "none";
     }
   };
-  let createPopper;
-  const updatePopper = (dom) => {
+  const createPopper = () => {
+    if (isServer) {
+      return;
+    }
+    state.currentPlacement = state.currentPlacement || props.placement;
+    if (!/^(top|bottom|left|right)(-start|-end)?$/g.test(state.currentPlacement)) {
+      return;
+    }
+    const options2 = props.popperOptions || { gpuAcceleration: false };
+    state.popperElm = state.popperElm || props.popper || refs.popper;
+    const popper = state.popperElm;
+    let reference = getReference({ state, props, refs, slots });
+    if (!popper || !reference || reference.nodeType !== Node.ELEMENT_NODE) {
+      return;
+    }
+    if (props.visibleArrow) {
+      appendArrow(popper);
+    }
+    if (props.appendToBody || props.popperAppendToBody) {
+      document.body.appendChild(state.popperElm);
+    } else {
+      parent && parent.$el && parent.$el.appendChild(state.popperElm);
+      options2.forceAbsolute = true;
+    }
+    options2.placement = state.currentPlacement;
+    options2.offset = props.offset || 0;
+    options2.arrowOffset = props.arrowOffset || 0;
+    options2.adjustArrow = props.adjustArrow || false;
+    state.popperJS = new PopperJS(reference, popper, options2);
+    emit("created", state);
+    if (typeof options2.onUpdate === "function") {
+      state.popperJS.onUpdate(options2.onUpdate);
+    }
+    state.popperJS._popper.style.zIndex = PopupManager.nextZIndex().toString();
+    followHide(state.popperJS);
+    on(state.popperElm, "click", stop);
+  };
+  const updatePopper = (popperElm) => {
+    if (popperElm) {
+      state.popperElm = popperElm;
+    }
     const popperJS = state.popperJS;
     if (popperJS) {
       popperJS.update();
-      if (popperJS._popper && dom !== true) {
-        popperJS._popper.style.zIndex = nextZIndex(popperJS._reference);
-        followHide(popperJS);
-      }
     } else {
-      createPopper(dom);
+      createPopper();
     }
   };
-  createPopper = createPopperFn({
-    state,
-    props,
-    refs,
-    slots,
-    appendArrow,
-    emit,
-    resetTransformOrigin,
-    nextTick,
-    updatePopper,
-    nextZIndex,
-    parent,
-    followHide
-  });
   const doDestroy = (forceDestroy) => {
     if (!state.popperJS || state.showPopper && !forceDestroy) {
       return;
@@ -239,31 +104,35 @@ var vue_popper_default = ({
     state.popperJS = null;
   };
   const destroyPopper = (remove) => {
-    if (state.popperJS) {
-      resetTransformOrigin();
-    }
     if (remove) {
       if (state.popperElm) {
-        const parentNode = state.popperElm.parentNode;
-        if (parentNode) {
-          parentNode.removeChild(state.popperElm);
-        }
+        state.popperElm.remove();
       }
     }
   };
-  setWatchFn({
-    watch,
-    props,
-    state,
-    emit,
-    nextTick,
-    updatePopper,
-    destroyPopper,
-    onBeforeUnmount,
-    onDeactivated,
-    doDestroy
+  watch(
+    () => state.showPopper,
+    (val) => {
+      if (props.disabled) {
+        return;
+      }
+      if (val) {
+        updatePopper();
+      }
+      props.trigger === "manual" && emit("update:modelValue", val);
+    }
+  );
+  onBeforeUnmount(() => {
+    nextTick(() => {
+      doDestroy(true);
+      destroyPopper("remove");
+    });
+  });
+  onDeactivated(() => {
+    doDestroy(true);
+    destroyPopper("remove");
   });
-  return __spreadValues({ doDestroy, appendArrow, createPopper, updatePopper, destroyPopper, resetTransformOrigin }, toRefs(state));
+  return __spreadValues({ updatePopper, destroyPopper, doDestroy }, toRefs(state));
 };
 export {
   vue_popper_default as default