@opentiny/vue-renderless 3.6.0 → 3.6.1-alpha.2

package/dialog-box/index.js

@@ -1,278 +1,208 @@
-import { on, off, addClass, removeClass } from '@opentiny/vue-renderless/common/deps/dom';
-import { emitEvent } from '@opentiny/vue-renderless/common/event';
-import { getDomNode } from '@opentiny/vue-renderless/common/deps/dom';
-export var computedAnimationName = function computedAnimationName(_ref) {
-  var constants = _ref.constants,
-    props = _ref.props;
-  return function () {
-    return props.rightSlide ? constants.DIALOG_SLIDER_RIGHT : constants.DIALOG_FADE;
-  };
-};
-export var computedAddUnit = function computedAddUnit(value) {
-  return isNaN(Number(value)) ? value : value + 'px';
-};
-export var computedStyle = function computedStyle(_ref2) {
-  var props = _ref2.props,
-    state = _ref2.state;
-  return function () {
-    var style = {};
-    var width = props.width,
-      top = props.top,
-      rightSlide = props.rightSlide;
-    if (top === undefined) {
-      top = rightSlide ? '0' : '15vh';
-    }
-    width = computedAddUnit(width);
-    top = computedAddUnit(top);
-    if (!state.isFull) {
-      style.width = width;
-      style.top = top;
-      if (rightSlide) {
-        style.right = 0;
-        style.height = 'calc(100vh - ' + style.top + ')';
-      } else {
-        style.left = 'calc((100vw - ' + width + ') / 2)';
-      }
+import "../chunk-PKUHTIDK.js";
+import { on, off, addClass, removeClass } from "@opentiny/vue-renderless/common/deps/dom";
+import { emitEvent } from "@opentiny/vue-renderless/common/event";
+import { getDomNode } from "@opentiny/vue-renderless/common/deps/dom";
+const computedAnimationName = ({ constants, props }) => () => props.rightSlide ? constants.DIALOG_SLIDER_RIGHT : constants.DIALOG_FADE;
+const computedAddUnit = (value) => isNaN(Number(value)) ? value : value + "px";
+const computedStyle = ({ props, state }) => () => {
+  const style = {};
+  let { width, top, rightSlide } = props;
+  if (top === void 0) {
+    top = rightSlide ? "0" : "15vh";
+  }
+  width = computedAddUnit(width);
+  top = computedAddUnit(top);
+  if (!state.isFull) {
+    style.width = width;
+    style.top = top;
+    if (rightSlide) {
+      style.right = 0;
+      style.height = "calc(100vh - " + style.top + ")";
+    } else {
+      style.left = "calc((100vw - " + width + ") / 2)";
     }
-    return style;
-  };
+  }
+  return style;
 };
-export var watchVisible = function watchVisible(_ref3) {
-  var api = _ref3.api,
-    constants = _ref3.constants,
-    emit = _ref3.emit,
-    nextTick = _ref3.nextTick,
-    parent = _ref3.parent,
-    props = _ref3.props,
-    refs = _ref3.refs,
-    state = _ref3.state;
-  return function (val) {
-    var el = parent.$el;
-    if (props.lockScroll) {
-      val ? api.showScrollbar() : api.hideScrollbar();
+const watchVisible = ({ api, constants, emit, nextTick, parent, props, refs, state }) => (val) => {
+  const el = parent.$el;
+  if (props.lockScroll) {
+    val ? api.showScrollbar() : api.hideScrollbar();
+  }
+  state.move = false;
+  state.isFull = props.fullscreen;
+  emit("update:visible", val);
+  if (val) {
+    state.closed = false;
+    emit("open");
+    on(el, "scroll", api.updatePopper);
+    nextTick(() => {
+      refs.dialog.scrollTop = 0;
+    });
+    if (props.appendToBody) {
+      document.body.appendChild(el);
     }
-    state.move = false;
-    state.isFull = props.fullscreen;
-    emit('update:visible', val);
-    if (val) {
-      state.closed = false;
-      emit('open');
-      on(el, 'scroll', api.updatePopper);
-      nextTick(function () {
-        refs.dialog.scrollTop = 0;
-      });
-      if (props.appendToBody) {
-        document.body.appendChild(el);
-      }
-    } else {
-      off(el, 'scroll', api.updatePopper);
-      if (!state.closed) {
-        state.emitter.emit('boxclose', props.isFormReset);
-        emit('close');
-      }
-      if (props.destroyOnClose) {
-        nextTick(function () {
-          return state.key++;
-        });
-      }
-      if (props.rightSlide) {
-        var dialogBoxDom = el.querySelector(constants.DIALOG_BOX_CLASS) || el;
-        dialogBoxDom.style.left = '';
-      }
+  } else {
+    off(el, "scroll", api.updatePopper);
+    if (!state.closed) {
+      state.emitter.emit("boxclose", props.isFormReset);
+      emit("close");
     }
-  };
-};
-export var mounted = function mounted(_ref4) {
-  var api = _ref4.api,
-    parent = _ref4.parent,
-    props = _ref4.props;
-  return function () {
-    if (props.lockScroll && props.visible) {
-      api.showScrollbar();
+    if (props.destroyOnClose) {
+      nextTick(() => state.key++);
     }
-    if (props.visible) {
-      var el = parent.$el;
-      api.open();
-      if (props.appendToBody) {
-        document.body.appendChild(el);
-      }
+    if (props.rightSlide) {
+      const dialogBoxDom = el.querySelector(constants.DIALOG_BOX_CLASS) || el;
+      dialogBoxDom.style.left = "";
     }
-  };
+  }
 };
-export var unMounted = function unMounted(_ref5) {
-  var api = _ref5.api,
-    parent = _ref5.parent,
-    props = _ref5.props;
-  return function () {
-    var el = parent.$el;
-    api.hideScrollbar();
-    if (props.appendToBody && el && el.parentNode) {
-      el.parentNode.removeChild(el);
+const mounted = ({ api, parent, props }) => () => {
+  if (props.lockScroll && props.visible) {
+    api.showScrollbar();
+  }
+  if (props.visible) {
+    const el = parent.$el;
+    api.open();
+    if (props.appendToBody) {
+      document.body.appendChild(el);
     }
-  };
+  }
 };
-export var handleWrapperClick = function handleWrapperClick(_ref6) {
-  var api = _ref6.api,
-    props = _ref6.props;
-  return function () {
-    if (!props.closeOnClickModal) {
-      return;
-    }
-    api.handleClose('mask');
-  };
+const unMounted = ({ api, parent, props }) => () => {
+  const el = parent.$el;
+  api.hideScrollbar();
+  if (props.appendToBody && el && el.parentNode) {
+    el.parentNode.removeChild(el);
+  }
 };
-export var handleClose = function handleClose(_ref7) {
-  var api = _ref7.api,
-    constants = _ref7.constants,
-    emit = _ref7.emit,
-    parent = _ref7.parent,
-    props = _ref7.props;
-  return function () {
-    var type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'close';
-    if (typeof props.beforeClose === 'function' && props.beforeClose(type) === false) {
-      return;
-    }
-    var el = parent.$el;
-    if (props.rightSlide) {
-      var dialogBoxDom = el.querySelector(constants.DIALOG_BOX_CLASS) || el;
-      dialogBoxDom.style.left = '';
-    }
-    if (!emitEvent(emit, 'before-close', api.hide)) {
-      return;
-    }
-    api.hide();
-  };
+const handleWrapperClick = ({ api, props }) => () => {
+  if (!props.closeOnClickModal) {
+    return;
+  }
+  api.handleClose("mask");
 };
-export var hide = function hide(_ref8) {
-  var api = _ref8.api,
-    emit = _ref8.emit,
-    state = _ref8.state,
-    props = _ref8.props;
-  return function (cancel) {
-    if (cancel !== false) {
-      state.emitter.emit('boxclose', props.isFormReset);
-      emit('update:visible', false);
-      emit('change', false);
-      emit('close');
-      state.closed = true;
-      api.hideScrollbar();
-    }
-  };
+const handleClose = ({ api, constants, emit, parent, props }) => (type = "close") => {
+  if (typeof props.beforeClose === "function" && props.beforeClose(type) === false) {
+    return;
+  }
+  const el = parent.$el;
+  if (props.rightSlide) {
+    const dialogBoxDom = el.querySelector(constants.DIALOG_BOX_CLASS) || el;
+    dialogBoxDom.style.left = "";
+  }
+  if (!emitEvent(emit, "before-close", api.hide)) {
+    return;
+  }
+  api.hide();
+};
+const hide = ({ api, emit, state, props }) => (cancel) => {
+  if (cancel !== false) {
+    state.emitter.emit("boxclose", props.isFormReset);
+    emit("update:visible", false);
+    emit("change", false);
+    emit("close");
+    state.closed = true;
+    api.hideScrollbar();
+  }
 };
-export var handleConfirm = function handleConfirm(_ref9) {
-  var api = _ref9.api,
-    emit = _ref9.emit;
-  return function () {
-    emit('confirm');
-    api.handleClose();
-  };
+const handleConfirm = ({ api, emit }) => () => {
+  emit("confirm");
+  api.handleClose();
 };
-export var handleCancel = function handleCancel(_ref10) {
-  var api = _ref10.api,
-    emit = _ref10.emit;
-  return function () {
-    emit('cancel');
-    api.handleClose();
-  };
+const handleCancel = ({ api, emit }) => () => {
+  emit("cancel");
+  api.handleClose();
 };
-export var updatePopper = function updatePopper(_ref11) {
-  var api = _ref11.api,
-    constants = _ref11.constants;
-  return function () {
-    api.broadcast(constants.SELECT_DROPDOWN, 'updatePopper');
-    api.broadcast(constants.DROPDOWN_MENU, 'updatePopper');
-  };
+const updatePopper = ({ api, constants }) => () => {
+  api.broadcast(constants.SELECT_DROPDOWN, "updatePopper");
+  api.broadcast(constants.DROPDOWN_MENU, "updatePopper");
 };
-export var afterEnter = function afterEnter(emit) {
-  return function () {
-    emit('opened');
-  };
+const afterEnter = (emit) => () => {
+  emit("opened");
 };
-export var afterLeave = function afterLeave(emit) {
-  return function () {
-    emit('closed');
-  };
+const afterLeave = (emit) => () => {
+  emit("closed");
 };
-var findPopoverComponent = function findPopoverComponent(_ref12) {
-  var vm = _ref12.vm,
-    componentList = _ref12.componentList;
-  var children = vm.$children;
+const findPopoverComponent = ({ vm, componentList }) => {
+  const children = vm.$children;
   if (!children || children.length === 0) {
     return;
   }
-  children.forEach(function (child) {
-    var tag = child.$options.componentName;
-    if (tag === 'Select') {
+  children.forEach((child) => {
+    const tag = child.$options.componentName;
+    if (tag === "Select") {
       componentList.push(child);
     }
-    findPopoverComponent({
-      vm: child,
-      componentList: componentList
-    });
+    findPopoverComponent({ vm: child, componentList });
   });
   return componentList;
 };
-var closeAllPopover = function closeAllPopover(parent) {
-  findPopoverComponent({
-    vm: parent,
-    componentList: []
-  }).forEach(function (component) {
+const closeAllPopover = (parent) => {
+  findPopoverComponent({ vm: parent, componentList: [] }).forEach((component) => {
     component.state.visible = false;
   });
 };
-export var handleDrag = function handleDrag(_ref13) {
-  var parent = _ref13.parent,
-    props = _ref13.props,
-    state = _ref13.state,
-    emit = _ref13.emit;
-  return function (event) {
-    if (!props.draggable) {
-      return;
+const handleDrag = ({ parent, props, state, emit }) => (event) => {
+  if (!props.draggable) {
+    return;
+  }
+  let modalBoxElem = parent.$el.querySelector(".tiny-dialog-box");
+  event.preventDefault();
+  let demMousemove = document.onmousemove;
+  let demMouseup = document.onmouseup;
+  let disX = event.clientX - modalBoxElem.offsetLeft;
+  let disY = event.clientY - modalBoxElem.offsetTop;
+  let { visibleHeight, visibleWidth } = getDomNode();
+  document.onmousemove = (event2) => {
+    event2.preventDefault();
+    if (!state.move) {
+      emit("drag-start", event2);
+      closeAllPopover(parent);
+      state.move = true;
     }
-    var modalBoxElem = parent.$el.querySelector('.tiny-dialog-box');
-    event.preventDefault();
-    var demMousemove = document.onmousemove;
-    var demMouseup = document.onmouseup;
-    var disX = event.clientX - modalBoxElem.offsetLeft;
-    var disY = event.clientY - modalBoxElem.offsetTop;
-    var _getDomNode = getDomNode(),
-      visibleHeight = _getDomNode.visibleHeight,
-      visibleWidth = _getDomNode.visibleWidth;
-    document.onmousemove = function (event) {
-      event.preventDefault();
-      if (!state.move) {
-        emit('drag-start', event);
-        closeAllPopover(parent);
-        state.move = true;
-      }
-      var offsetWidth = modalBoxElem.offsetWidth;
-      var offsetHeight = modalBoxElem.offsetHeight;
-      var maxX = visibleWidth - offsetWidth;
-      var maxY = visibleHeight - offsetHeight;
-      var left = event.clientX - disX;
-      var top = event.clientY - disY;
-      left = left < 0 ? 0 : left > maxX ? maxX : left;
-      top = top < 0 ? 0 : top > maxY ? maxY : top;
-      modalBoxElem.style.left = "".concat(left, "px");
-      modalBoxElem.style.top = "".concat(top, "px");
-      state.emitter.emit('boxdrag');
-      emit('drag-move', event);
-    };
-    document.onmouseup = function () {
-      document.onmousemove = demMousemove;
-      document.onmouseup = demMouseup;
-      state.move = false;
-      props.draggable && emit('drag-end', event);
-    };
-  };
-};
-export var showScrollbar = function showScrollbar(lockScrollClass) {
-  return function () {
-    addClass(document.body, lockScrollClass);
-  };
+    let offsetWidth = modalBoxElem.offsetWidth;
+    let offsetHeight = modalBoxElem.offsetHeight;
+    let maxX = visibleWidth - offsetWidth;
+    let maxY = visibleHeight - offsetHeight;
+    let left = event2.clientX - disX;
+    let top = event2.clientY - disY;
+    left = left < 0 ? 0 : left > maxX ? maxX : left;
+    top = top < 0 ? 0 : top > maxY ? maxY : top;
+    modalBoxElem.style.left = `${left}px`;
+    modalBoxElem.style.top = `${top}px`;
+    state.emitter.emit("boxdrag");
+    emit("drag-move", event2);
+  };
+  document.onmouseup = () => {
+    document.onmousemove = demMousemove;
+    document.onmouseup = demMouseup;
+    state.move = false;
+    props.draggable && emit("drag-end", event);
+  };
+};
+const showScrollbar = (lockScrollClass) => () => {
+  addClass(document.body, lockScrollClass);
+};
+const hideScrollbar = (lockScrollClass) => () => {
+  removeClass(document.body, lockScrollClass);
+};
+export {
+  afterEnter,
+  afterLeave,
+  computedAddUnit,
+  computedAnimationName,
+  computedStyle,
+  handleCancel,
+  handleClose,
+  handleConfirm,
+  handleDrag,
+  handleWrapperClick,
+  hide,
+  hideScrollbar,
+  mounted,
+  showScrollbar,
+  unMounted,
+  updatePopper,
+  watchVisible
 };
-export var hideScrollbar = function hideScrollbar(lockScrollClass) {
-  return function () {
-    removeClass(document.body, lockScrollClass);
-  };
-};