@element-plus/nightly 0.0.20220203 → 0.0.20220204

package/dist/index.full.js

@@ -1,4 +1,4 @@
-/*! Element Plus v0.0.20220203 */
+/*! Element Plus v0.0.20220204 */
 
 (function (global, factory) {
 	typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -3019,6 +3019,13 @@
 	  return vue.computed(() => disabled.value || vue.unref(fallback) || (form == null ? void 0 : form.disabled) || false);
 	};
 
+	const useDeprecated = ({ from, replacement, scope, version, ref }, condition) => {
+	  vue.watch(() => vue.unref(condition), (val) => {
+	  }, {
+	    immediate: true
+	  });
+	};
+
 	const useDraggable = (targetRef, dragRef, draggable) => {
 	  let transform = {
 	    offsetX: 0,
@@ -4604,7 +4611,7 @@
 	  });
 	}
 
-	const version$1 = "0.0.20220203";
+	const version$1 = "0.0.20220204";
 
 	const INSTALLED_KEY = Symbol("INSTALLED_KEY");
 	const makeInstaller = (components = []) => {
@@ -7007,15 +7014,15 @@
 	  always: Boolean
 	});
 
-	const COMPONENT_NAME$9 = "Thumb";
+	const COMPONENT_NAME$f = "Thumb";
 	const _sfc_main$26 = vue.defineComponent({
-	  name: COMPONENT_NAME$9,
+	  name: COMPONENT_NAME$f,
 	  props: thumbProps,
 	  setup(props) {
 	    const scrollbar = vue.inject(scrollbarContextKey);
 	    const ns = useNamespace("scrollbar");
 	    if (!scrollbar)
-	      throwError(COMPONENT_NAME$9, "can not inject scrollbar context");
+	      throwError(COMPONENT_NAME$f, "can not inject scrollbar context");
 	    const instance = vue.ref();
 	    const thumb = vue.ref();
 	    const thumbState = vue.ref({});
@@ -9322,9 +9329,9 @@
 	}
 	var ElPopperArrow = /* @__PURE__ */ _export_sfc$1(_sfc_main$22, [["render", _sfc_render$1Z]]);
 
-	const NAME$1 = "ElOnlyChild";
+	const NAME = "ElOnlyChild";
 	const OnlyChild = vue.defineComponent({
-	  name: NAME$1,
+	  name: NAME,
 	  setup(_, { slots, attrs }) {
 	    var _a;
 	    const forwardRefInjection = vue.inject(FORWARD_REF_INJECTION_KEY, void 0);
@@ -9603,6 +9610,23 @@
 	}
 	var ElPopperContent = /* @__PURE__ */ _export_sfc$1(_sfc_main$20, [["render", _sfc_render$1X]]);
 
+	function useDeprecateAppendToBody(scope, from) {
+	  const vm = vue.getCurrentInstance();
+	  const compatTeleported = vue.computed(() => {
+	    return isBool(vm.props[from]) ? vm.props[from] : vm.props.teleported;
+	  });
+	  useDeprecated({
+	    scope,
+	    from,
+	    replacement: "teleported",
+	    version: "2.1.0",
+	    ref: "https://element-plus.org/en-US/component/tooltip.html#attributes"
+	  }, vue.computed(() => isBool(vm.props[from])));
+	  return {
+	    compatTeleported
+	  };
+	}
+
 	const ElPopper = withInstall(Popper);
 
 	const _sfc_main$1$ = vue.defineComponent({
@@ -10085,8 +10109,9 @@
 
 	const ElTooltip = withInstall(Tooltip);
 
+	const COMPONENT_NAME$e = "ElAutocomplete";
 	const _sfc_main$1X = vue.defineComponent({
-	  name: "ElAutocomplete",
+	  name: COMPONENT_NAME$e,
 	  components: {
 	    ElTooltip,
 	    ElInput,
@@ -10147,8 +10172,9 @@
 	    },
 	    popperAppendToBody: {
 	      type: Boolean,
-	      default: true
+	      default: void 0
 	    },
+	    teleported: useTooltipContentProps.teleported,
 	    highlightFirstItem: {
 	      type: Boolean,
 	      default: false
@@ -10165,6 +10191,7 @@
 	  ],
 	  setup(props, ctx) {
 	    const ns = useNamespace("autocomplete");
+	    const { compatTeleported } = useDeprecateAppendToBody(COMPONENT_NAME$e, "popperAppendToBody");
 	    const attrs = useAttrs();
 	    const suggestions = vue.ref([]);
 	    const highlightedIndex = vue.ref(-1);
@@ -10312,6 +10339,7 @@
 	      id,
 	      suggestionVisible,
 	      suggestionLoading,
+	      compatTeleported,
 	      getData,
 	      handleInput,
 	      handleChange,
@@ -10345,7 +10373,7 @@
 	    placement: _ctx.placement,
 	    "fallback-placements": ["bottom-start", "top-start"],
 	    "popper-class": `${_ctx.ns.e("popper")} ${_ctx.popperClass}`,
-	    "append-to-body": _ctx.popperAppendToBody,
+	    teleported: _ctx.compatTeleported,
 	    "gpu-acceleration": false,
 	    pure: "",
 	    "manual-mode": "",
@@ -10449,7 +10477,7 @@
 	      ])
 	    ]),
 	    _: 3
-	  }, 8, ["visible", "placement", "popper-class", "append-to-body", "transition", "onShow"]);
+	  }, 8, ["visible", "placement", "popper-class", "teleported", "transition", "onShow"]);
 	}
 	var Autocomplete = /* @__PURE__ */ _export_sfc$1(_sfc_main$1X, [["render", _sfc_render$1S]]);
 
@@ -10584,9 +10612,9 @@
 	  click: (evt) => evt instanceof MouseEvent
 	};
 
-	const COMPONENT_NAME$8 = "ElBacktop";
+	const COMPONENT_NAME$d = "ElBacktop";
 	const _sfc_main$1V = vue.defineComponent({
-	  name: COMPONENT_NAME$8,
+	  name: COMPONENT_NAME$d,
 	  components: {
 	    ElIcon,
 	    CaretTop: caretTop
@@ -10632,7 +10660,7 @@
 	      if (props.target) {
 	        el.value = (_a = document.querySelector(props.target)) != null ? _a : void 0;
 	        if (!el.value) {
-	          throwError(COMPONENT_NAME$8, `target is not existed: ${props.target}`);
+	          throwError(COMPONENT_NAME$d, `target is not existed: ${props.target}`);
 	        }
 	        container.value = el.value;
 	      }
@@ -10800,9 +10828,9 @@
 	  }
 	});
 
-	const COMPONENT_NAME$7 = "ElBreadcrumbItem";
+	const COMPONENT_NAME$c = "ElBreadcrumbItem";
 	const _sfc_main$1S = vue.defineComponent({
-	  name: COMPONENT_NAME$7,
+	  name: COMPONENT_NAME$c,
 	  components: {
 	    ElIcon
 	  },
@@ -17380,8 +17408,9 @@
 	    }
 	  ]
 	};
+	const COMPONENT_NAME$b = "ElCascader";
 	const _sfc_main$1w = vue.defineComponent({
-	  name: "ElCascader",
+	  name: COMPONENT_NAME$b,
 	  components: {
 	    ElCascaderPanel: _CascaderPanel,
 	    ElInput,
@@ -17435,8 +17464,9 @@
 	    },
 	    popperAppendToBody: {
 	      type: Boolean,
-	      default: true
-	    }
+	      default: void 0
+	    },
+	    teleported: useTooltipContentProps.teleported
 	  },
 	  emits: [
 	    UPDATE_MODEL_EVENT,
@@ -17450,6 +17480,7 @@
 	  setup(props, { emit }) {
 	    let inputInitialHeight = 0;
 	    let pressDeleteCount = 0;
+	    const { compatTeleported } = useDeprecateAppendToBody(COMPONENT_NAME$b, "popperAppendToBody");
 	    const { t } = useLocale();
 	    const elForm = vue.inject(elFormKey, {});
 	    const elFormItem = vue.inject(elFormItemKey, {});
@@ -17763,6 +17794,7 @@
 	      multiple,
 	      readonly,
 	      clearBtnVisible,
+	      compatTeleported,
 	      t,
 	      togglePopperVisible,
 	      hideSuggestionPanel,
@@ -17803,7 +17835,7 @@
 	    ref: "tooltipRef",
 	    visible: _ctx.popperVisible,
 	    "onUpdate:visible": _cache[17] || (_cache[17] = ($event) => _ctx.popperVisible = $event),
-	    "append-to-body": _ctx.popperAppendToBody,
+	    teleported: _ctx.compatTeleported,
 	    "popper-class": `el-cascader__dropdown ${_ctx.popperClass}`,
 	    "popper-options": _ctx.popperOptions,
 	    "fallback-placements": [
@@ -17969,7 +18001,7 @@
 	      ]) : vue.createCommentVNode("v-if", true)
 	    ]),
 	    _: 3
-	  }, 8, ["visible", "append-to-body", "popper-class", "popper-options", "onHide"]);
+	  }, 8, ["visible", "teleported", "popper-class", "popper-options", "onHide"]);
 	}
 	var Cascader = /* @__PURE__ */ _export_sfc$1(_sfc_main$1w, [["render", _sfc_render$1s]]);
 
@@ -27693,19 +27725,19 @@
 	    default: void 0
 	  }
 	});
-	const COMPONENT_NAME$6 = "ElSubMenu";
+	const COMPONENT_NAME$a = "ElSubMenu";
 	var SubMenu = vue.defineComponent({
-	  name: COMPONENT_NAME$6,
+	  name: COMPONENT_NAME$a,
 	  props: subMenuProps,
 	  setup(props, { slots, expose }) {
 	    const instance = vue.getCurrentInstance();
 	    const { paddingStyle, indexPath, parentMenu } = useMenu(instance, vue.computed(() => props.index));
 	    const rootMenu = vue.inject("rootMenu");
 	    if (!rootMenu)
-	      throwError(COMPONENT_NAME$6, "can not inject root menu");
+	      throwError(COMPONENT_NAME$a, "can not inject root menu");
 	    const subMenu = vue.inject(`subMenu:${parentMenu.value.uid}`);
 	    if (!subMenu)
-	      throwError(COMPONENT_NAME$6, "can not inject sub menu");
+	      throwError(COMPONENT_NAME$a, "can not inject sub menu");
 	    const items = vue.ref({});
 	    const subMenus = vue.ref({});
 	    let timeout;
@@ -28228,9 +28260,9 @@
 	  click: (item) => isString$1(item.index) && Array.isArray(item.indexPath)
 	};
 
-	const COMPONENT_NAME$5 = "ElMenuItem";
+	const COMPONENT_NAME$9 = "ElMenuItem";
 	const _sfc_main$P = vue.defineComponent({
-	  name: COMPONENT_NAME$5,
+	  name: COMPONENT_NAME$9,
 	  components: {
 	    ElTooltip
 	  },
@@ -28240,11 +28272,11 @@
 	    const instance = vue.getCurrentInstance();
 	    const rootMenu = vue.inject("rootMenu");
 	    if (!rootMenu)
-	      throwError(COMPONENT_NAME$5, "can not inject root menu");
+	      throwError(COMPONENT_NAME$9, "can not inject root menu");
 	    const { parentMenu, paddingStyle, indexPath } = useMenu(instance, vue.toRef(props, "index"));
 	    const subMenu = vue.inject(`subMenu:${parentMenu.value.uid}`);
 	    if (!subMenu)
-	      throwError(COMPONENT_NAME$5, "can not inject sub menu");
+	      throwError(COMPONENT_NAME$9, "can not inject sub menu");
 	    const active = vue.computed(() => props.index === rootMenu.activeIndex);
 	    const item = vue.reactive({
 	      index: props.index,
@@ -28328,15 +28360,15 @@
 	  title: String
 	};
 
-	const COMPONENT_NAME$4 = "ElMenuItemGroup";
+	const COMPONENT_NAME$8 = "ElMenuItemGroup";
 	const _sfc_main$O = vue.defineComponent({
-	  name: COMPONENT_NAME$4,
+	  name: COMPONENT_NAME$8,
 	  props: menuItemGroupProps,
 	  setup() {
 	    const instance = vue.getCurrentInstance();
 	    const menu = vue.inject("rootMenu");
 	    if (!menu)
-	      throwError(COMPONENT_NAME$4, "can not inject root menu");
+	      throwError(COMPONENT_NAME$8, "can not inject root menu");
 	    const levelPadding = vue.computed(() => {
 	      if (menu.props.collapse)
 	        return 20;
@@ -29421,9 +29453,10 @@
 	  };
 	};
 
+	const COMPONENT_NAME$7 = "ElSelect";
 	const _sfc_main$I = vue.defineComponent({
-	  name: "ElSelect",
-	  componentName: "ElSelect",
+	  name: COMPONENT_NAME$7,
+	  componentName: COMPONENT_NAME$7,
 	  components: {
 	    ElInput,
 	    ElSelectMenu: ElSelectMenu$1,
@@ -29485,8 +29518,9 @@
 	    collapseTags: Boolean,
 	    popperAppendToBody: {
 	      type: Boolean,
-	      default: true
+	      default: void 0
 	    },
+	    teleported: useTooltipContentProps.teleported,
 	    clearIcon: {
 	      type: [String, Object],
 	      default: circleClose
@@ -29666,6 +29700,7 @@
 	      var _a, _b;
 	      return (_b = (_a = tooltipRef.value) == null ? void 0 : _a.popperRef) == null ? void 0 : _b.contentRef;
 	    });
+	    const { compatTeleported } = useDeprecateAppendToBody(COMPONENT_NAME$7, "popperAppendToBody");
 	    return {
 	      tagInMultiLine,
 	      prefixWidth,
@@ -29726,7 +29761,8 @@
 	      selectWrapper,
 	      scrollbar,
 	      wrapperKls,
-	      selectTagsStyle
+	      selectTagsStyle,
+	      compatTeleported
 	    };
 	  }
 	});
@@ -29758,7 +29794,7 @@
 	      visible: _ctx.dropMenuVisible,
 	      "onUpdate:visible": _cache[23] || (_cache[23] = ($event) => _ctx.dropMenuVisible = $event),
 	      placement: "bottom-start",
-	      "append-to-body": _ctx.popperAppendToBody,
+	      teleported: _ctx.compatTeleported,
 	      "popper-class": `el-select__popper ${_ctx.popperClass}`,
 	      "fallback-placements": ["bottom-start", "top-start", "right", "left"],
 	      effect: "light",
@@ -29977,7 +30013,7 @@
 	        })
 	      ]),
 	      _: 3
-	    }, 8, ["visible", "append-to-body", "popper-class", "onShow"])
+	    }, 8, ["visible", "teleported", "popper-class", "onShow"])
 	  ], 2)), [
 	    [_directive_click_outside, _ctx.handleClose, _ctx.popperPaneRef]
 	  ]);
@@ -30655,52 +30691,56 @@
 
 	const ElPagination = withInstall(Pagination);
 
-	const popconfirmProps = buildProps({
-	  title: {
-	    type: String
-	  },
-	  confirmButtonText: {
-	    type: String
-	  },
-	  cancelButtonText: {
-	    type: String
-	  },
-	  confirmButtonType: {
-	    type: String,
-	    values: buttonType,
-	    default: "primary"
-	  },
-	  cancelButtonType: {
-	    type: String,
-	    values: buttonType,
-	    default: "text"
-	  },
-	  icon: {
-	    type: definePropType([String, Object]),
-	    default: questionFilled
-	  },
-	  iconColor: {
-	    type: String,
-	    default: "#f90"
-	  },
-	  hideIcon: {
-	    type: Boolean,
-	    default: false
-	  },
-	  hideAfter: {
-	    type: Number,
-	    default: 200
-	  },
-	  onConfirm: {
-	    type: definePropType(Function)
-	  },
-	  onCancel: {
-	    type: definePropType(Function)
-	  }
-	});
+	const popconfirmProps = {
+	  ...buildProps({
+	    title: {
+	      type: String
+	    },
+	    confirmButtonText: {
+	      type: String
+	    },
+	    cancelButtonText: {
+	      type: String
+	    },
+	    confirmButtonType: {
+	      type: String,
+	      values: buttonType,
+	      default: "primary"
+	    },
+	    cancelButtonType: {
+	      type: String,
+	      values: buttonType,
+	      default: "text"
+	    },
+	    icon: {
+	      type: definePropType([String, Object]),
+	      default: questionFilled
+	    },
+	    iconColor: {
+	      type: String,
+	      default: "#f90"
+	    },
+	    hideIcon: {
+	      type: Boolean,
+	      default: false
+	    },
+	    hideAfter: {
+	      type: Number,
+	      default: 200
+	    },
+	    onConfirm: {
+	      type: definePropType(Function)
+	    },
+	    onCancel: {
+	      type: definePropType(Function)
+	    }
+	  }),
+	  teleported: useTooltipContentProps.teleported
+	};
 
+	const COMPONENT_NAME$6 = "Elpopperconfirm";
 	const _sfc_main$C = vue.defineComponent({
-	  name: "ElPopconfirm",
+	  name: COMPONENT_NAME$6,
 	  components: {
 	    ElButton,
 	    ElTooltip,
@@ -30708,6 +30748,7 @@
 	  },
 	  props: popconfirmProps,
 	  setup(props) {
+	    const { compatTeleported } = useDeprecateAppendToBody(COMPONENT_NAME$6, "appendToBody");
 	    const { t } = useLocale();
 	    const tooltipRef = vue.ref();
 	    const hidePopper = () => {
@@ -30733,6 +30774,7 @@
 	      finalConfirmButtonText,
 	      finalCancelButtonText,
 	      tooltipRef,
+	      compatTeleported,
 	      confirm,
 	      cancel
 	    };
@@ -30749,7 +30791,7 @@
 	    trigger: "click",
 	    effect: "light",
 	    "popper-class": "el-popover",
-	    "append-to-body": "",
+	    teleported: _ctx.compatTeleported,
 	    "fallback-placements": ["bottom", "top", "right", "left"],
 	    "hide-after": _ctx.hideAfter,
 	    persistent: ""
@@ -30797,13 +30839,14 @@
 	      _ctx.$slots.reference ? vue.renderSlot(_ctx.$slots, "reference", { key: 0 }) : vue.createCommentVNode("v-if", true)
 	    ]),
 	    _: 3
-	  }, 16, ["hide-after"]);
+	  }, 16, ["teleported", "hide-after"]);
 	}
 	var Popconfirm = /* @__PURE__ */ _export_sfc$1(_sfc_main$C, [["render", _sfc_render$y]]);
 
 	const ElPopconfirm = withInstall(Popconfirm);
 
 	const usePopoverProps = {
+	  appendToBody: { type: Boolean, default: void 0 },
 	  content: useTooltipContentProps.content,
 	  popperStyle: useTooltipContentProps.popperStyle,
 	  popperClass: useTooltipContentProps.popperClass,
@@ -30815,6 +30858,7 @@
 	    ...useTooltipContentProps.effect,
 	    default: "light"
 	  },
+	  teleported: useTooltipContentProps.teleported,
 	  ...buildProps({
 	    title: String,
 	    width: {
@@ -30825,9 +30869,9 @@
 	};
 
 	const emits = ["update:visible", "after-enter", "after-leave"];
-	const NAME = "ElPopover";
+	const COMPONENT_NAME$5 = "ElPopover";
 	const _sfc_main$B = vue.defineComponent({
-	  name: NAME,
+	  name: COMPONENT_NAME$5,
 	  components: {
 	    ElTooltip
 	  },
@@ -30860,6 +30904,7 @@
 	        props.popperClass
 	      ];
 	    });
+	    const { compatTeleported } = useDeprecateAppendToBody(COMPONENT_NAME$5, "appendToBody");
 	    const hide = () => {
 	      var _a;
 	      (_a = tooltipRef.value) == null ? void 0 : _a.hide();
@@ -30871,6 +30916,7 @@
 	      emit("after-leave");
 	    };
 	    return {
+	      compatTeleported,
 	      kls,
 	      style,
 	      tooltipRef,
@@ -30894,6 +30940,7 @@
 	    enterable: _ctx.enterable,
 	    "popper-class": _ctx.kls,
 	    "popper-style": _ctx.style,
+	    teleported: _ctx.compatTeleported,
 	    persistent: "",
 	    onShow: _ctx.afterEnter,
 	    onHide: _ctx.afterLeave
@@ -30908,7 +30955,7 @@
 	      _ctx.$slots.reference ? vue.renderSlot(_ctx.$slots, "reference", { key: 0 }) : vue.createCommentVNode("v-if", true)
 	    ]),
 	    _: 3
-	  }, 16, ["aria-label", "effect", "enterable", "popper-class", "popper-style", "onShow", "onHide"]);
+	  }, 16, ["aria-label", "effect", "enterable", "popper-class", "popper-style", "teleported", "onShow", "onHide"]);
 	}
 	var Popover = /* @__PURE__ */ _export_sfc$1(_sfc_main$B, [["render", _sfc_render$x]]);
 
@@ -33509,8 +33556,9 @@
 	  },
 	  popperAppendToBody: {
 	    type: Boolean,
-	    default: true
+	    default: void 0
 	  },
+	  teleported: useTooltipContentProps.teleported,
 	  popperClass: {
 	    type: String,
 	    default: ""
@@ -33873,9 +33921,11 @@
 	  default: 42,
 	  small: 33
 	};
+	const COMPONENT_NAME$4 = "ElSelectV2";
 	const useSelect = (props, emit) => {
 	  const { t } = useLocale();
 	  const { form: elForm, formItem: elFormItem } = useFormItem();
+	  const { compatTeleported } = useDeprecateAppendToBody(COMPONENT_NAME$4, "popperAppendToBody");
 	  const states = vue.reactive({
 	    inputValue: DEFAULT_INPUT_PLACEHOLDER,
 	    displayInputValue: DEFAULT_INPUT_PLACEHOLDER,
@@ -34452,7 +34502,7 @@
 	    popperRef,
 	    validateState,
 	    validateIcon,
-	    Effect,
+	    compatTeleported,
 	    debouncedOnInputChange,
 	    deleteTag,
 	    getLabel,
@@ -34548,7 +34598,7 @@
 	      ref: "popper",
 	      visible: _ctx.dropdownMenuVisible,
 	      "onUpdate:visible": _cache[22] || (_cache[22] = ($event) => _ctx.dropdownMenuVisible = $event),
-	      "append-to-body": _ctx.popperAppendToBody,
+	      teleported: _ctx.compatTeleported,
 	      "popper-class": `el-select-v2__popper ${_ctx.popperClass}`,
 	      "gpu-acceleration": false,
 	      "stop-popper-mouse-event": false,
@@ -34792,7 +34842,7 @@
 	        }, 8, ["data", "width", "hovering-index", "scrollbar-always-on"])
 	      ]),
 	      _: 3
-	    }, 8, ["visible", "append-to-body", "popper-class", "popper-options", "onShow"])
+	    }, 8, ["visible", "teleported", "popper-class", "popper-options", "onShow"])
 	  ], 34)), [
 	    [_directive_click_outside, _ctx.handleClickOutside, _ctx.popperRef]
 	  ]);
@@ -48603,6 +48653,8 @@
 	exports.useDelayedRender = useDelayedRender;
 	exports.useDelayedToggle = useDelayedToggle;
 	exports.useDelayedToggleProps = useDelayedToggleProps;
+	exports.useDeprecateAppendToBody = useDeprecateAppendToBody;
+	exports.useDeprecated = useDeprecated;
 	exports.useDialog = useDialog;
 	exports.useDisabled = useDisabled$1;
 	exports.useDraggable = useDraggable;