@element-plus/nightly 0.0.20220904 → 0.0.20220907

package/dist/index.full.js

@@ -1,4 +1,4 @@
-/*! Element Plus v0.0.20220904 */
+/*! Element Plus v0.0.20220907 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -1674,7 +1674,7 @@
 
   var upperFirst = createCaseFirst("toUpperCase");
 
-  function capitalize$1(string) {
+  function capitalize$2(string) {
     return upperFirst(toString(string).toLowerCase());
   }
 
@@ -1983,7 +1983,7 @@
 
   var camelCase = createCompounder(function(result, word, index) {
     word = word.toLowerCase();
-    return result + (index ? capitalize$1(word) : word);
+    return result + (index ? capitalize$2(word) : word);
   });
 
   function castArray$1() {
@@ -6166,7 +6166,7 @@
 
   var string$1 = {
     camelCase,
-    capitalize: capitalize$1,
+    capitalize: capitalize$2,
     deburr,
     endsWith,
     escape,
@@ -7510,7 +7510,7 @@
   });
   const hyphenateRE = /\B([A-Z])/g;
   const hyphenate = cacheStringFunction((str) => str.replace(hyphenateRE, "-$1").toLowerCase());
-  const capitalize = cacheStringFunction((str) => str.charAt(0).toUpperCase() + str.slice(1));
+  const capitalize$1 = cacheStringFunction((str) => str.charAt(0).toUpperCase() + str.slice(1));
 
   const isUndefined = (val) => val === void 0;
   const isEmpty = (val) => !val && val !== 0 || isArray(val) && val.length === 0 || isObject$1(val) && !Object.keys(val).length;
@@ -7524,6 +7524,7 @@
   };
 
   const escapeStringRegexp = (string = "") => string.replace(/[|\\{}()[\]^$+*?.]/g, "\\$&").replace(/-/g, "\\x2d");
+  const capitalize = (str) => capitalize$1(str);
 
   const keysOf = (arr) => Object.keys(arr);
   const entriesOf = (arr) => Object.entries(arr);
@@ -9826,7 +9827,8 @@
   };
 
   let cachedContainer;
-  const POPPER_CONTAINER_ID = `el-popper-container-${generateId()}`;
+  const namespace = useGlobalConfig("namespace", defaultNamespace);
+  const POPPER_CONTAINER_ID = `${namespace.value}-popper-container-${generateId()}`;
   const POPPER_CONTAINER_SELECTOR = `#${POPPER_CONTAINER_ID}`;
   const createContainer = () => {
     const container = document.createElement("div");
@@ -11026,7 +11028,7 @@
     return [recordCursor, setCursor];
   }
 
-  const version$1 = "0.0.20220904";
+  const version$1 = "0.0.20220907";
 
   const makeInstaller = (components = []) => {
     const install = (app, options) => {
@@ -32548,8 +32550,8 @@
       const criteria = props.clearable && !selectDisabled.value && states.inputHovering && hasValue;
       return criteria;
     });
-    const iconComponent = vue.computed(() => props.remote && props.filterable ? "" : props.suffixIcon);
-    const iconReverse = vue.computed(() => ns.is("reverse", iconComponent.value && states.visible));
+    const iconComponent = vue.computed(() => props.remote && props.filterable && !props.remoteShowSuffix ? "" : props.suffixIcon);
+    const iconReverse = vue.computed(() => ns.is("reverse", iconComponent.value && states.visible && props.suffixTransition));
     const debounce$1 = vue.computed(() => props.remote ? 300 : 0);
     const emptyText = vue.computed(() => {
       if (props.loading) {
@@ -32691,6 +32693,8 @@
     vue.watch(() => states.hoverIndex, (val) => {
       if (typeof val === "number" && val > -1) {
         hoverOption.value = optionsArray.value[val] || {};
+      } else {
+        hoverOption.value = {};
       }
       optionsArray.value.forEach((option) => {
         option.hover = hoverOption.value === option;
@@ -32902,6 +32906,7 @@
       }
       ctx.emit(UPDATE_MODEL_EVENT, value);
       emitChange(value);
+      states.hoverIndex = -1;
       states.visible = false;
       ctx.emit("clear");
     };
@@ -33243,7 +33248,7 @@
         default: true
       },
       clearIcon: {
-        type: [String, Object],
+        type: iconPropType,
         default: circle_close_default
       },
       fitInputWidth: {
@@ -33251,14 +33256,22 @@
         default: false
       },
       suffixIcon: {
-        type: [String, Object],
-        default: arrow_up_default
+        type: iconPropType,
+        default: arrow_down_default
       },
       tagType: { ...tagProps.type, default: "info" },
       validateEvent: {
         type: Boolean,
         default: true
       },
+      remoteShowSuffix: {
+        type: Boolean,
+        default: false
+      },
+      suffixTransition: {
+        type: Boolean,
+        default: true
+      },
       placement: {
         type: String,
         values: Ee,
@@ -33364,6 +33377,10 @@
         maxWidth: `${vue.unref(inputWidth) - 32}px`,
         width: "100%"
       }));
+      const tagTextStyle = vue.computed(() => {
+        const maxWidth = vue.unref(inputWidth) > 123 ? vue.unref(inputWidth) - 123 : vue.unref(inputWidth) - 75;
+        return { maxWidth: `${maxWidth}px` };
+      });
       vue.provide(selectKey, vue.reactive({
         props,
         options,
@@ -33474,7 +33491,8 @@
         scrollbar,
         wrapperKls,
         selectTagsStyle,
-        nsSelect
+        nsSelect,
+        tagTextStyle
       };
     }
   });
@@ -33537,7 +33555,7 @@
                   default: vue.withCtx(() => [
                     vue.createElementVNode("span", {
                       class: vue.normalizeClass(_ctx.nsSelect.e("tags-text")),
-                      style: vue.normalizeStyle({ maxWidth: _ctx.inputWidth - 123 + "px" })
+                      style: vue.normalizeStyle(_ctx.tagTextStyle)
                     }, vue.toDisplayString(_ctx.selected[0].currentLabel), 7)
                   ]),
                   _: 1
@@ -35245,24 +35263,21 @@
           width
         };
       });
-      const componentMap = vue.computed(() => isArray(props.icons) ? {
-        [props.lowThreshold]: props.icons[0],
-        [props.highThreshold]: {
-          value: props.icons[1],
-          excluded: true
-        },
-        [props.max]: props.icons[2]
-      } : props.icons);
+      const componentMap = vue.computed(() => {
+        let icons = isArray(props.icons) ? [...props.icons] : { ...props.icons };
+        icons = vue.markRaw(icons);
+        return isArray(icons) ? {
+          [props.lowThreshold]: icons[0],
+          [props.highThreshold]: {
+            value: icons[1],
+            excluded: true
+          },
+          [props.max]: icons[2]
+        } : icons;
+      });
       const decimalIconComponent = vue.computed(() => getValueFromMap(props.modelValue, componentMap.value));
-      const voidComponent = vue.computed(() => rateDisabled.value ? props.disabledVoidIcon : props.voidIcon);
+      const voidComponent = vue.computed(() => rateDisabled.value ? isString(props.disabledVoidIcon) ? props.disabledVoidIcon : vue.markRaw(props.disabledVoidIcon) : isString(props.voidIcon) ? props.voidIcon : vue.markRaw(props.voidIcon));
       const activeComponent = vue.computed(() => getValueFromMap(currentValue.value, componentMap.value));
-      const iconComponents = vue.computed(() => {
-        const result = Array.from({ length: props.max });
-        const threshold = currentValue.value;
-        result.fill(activeComponent.value, 0, threshold);
-        result.fill(voidComponent.value, threshold, props.max);
-        return result;
-      });
       function showDecimalIcon(item) {
         const showWhenDisabled = rateDisabled.value && valueDecimal.value > 0 && item - 1 < props.modelValue && item > props.modelValue;
         const showWhenAllowHalf = props.allowHalf && pointerAtLeftHalf.value && item - 0.5 <= currentValue.value && item > currentValue.value;
@@ -35385,7 +35400,14 @@
                 ])
               }, {
                 default: vue.withCtx(() => [
-                  !showDecimalIcon(item) ? (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(iconComponents)[item - 1]), { key: 0 })) : vue.createCommentVNode("v-if", true),
+                  !showDecimalIcon(item) ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
+                    vue.withDirectives((vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(activeComponent)), null, null, 512)), [
+                      [vue.vShow, item <= currentValue.value]
+                    ]),
+                    vue.withDirectives((vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(voidComponent)), null, null, 512)), [
+                      [vue.vShow, !(item <= currentValue.value)]
+                    ])
+                  ], 64)) : vue.createCommentVNode("v-if", true),
                   showDecimalIcon(item) ? (vue.openBlock(), vue.createBlock(vue.unref(ElIcon), {
                     key: 1,
                     style: vue.normalizeStyle(vue.unref(decimalStyle)),
@@ -40896,6 +40918,8 @@
         break;
       }
     }
+    if (!column)
+      throwError("ElTable", `No column matching with column-key: ${columnKey}`);
     return column;
   };
   const getColumnByCell = function(table, cell, namespace) {
@@ -44315,7 +44339,7 @@
       } = useStyle(props, layout, store, table);
       const { scrollBarRef, scrollTo, setScrollLeft, setScrollTop } = useScrollbar$1();
       const debouncedUpdateLayout = debounce(doLayout, 50);
-      const tableId = `el-table_${tableIdSeed++}`;
+      const tableId = `${ns.namespace.value}-table_${tableIdSeed++}`;
       table.tableId = tableId;
       table.state = {
         isGroup,
@@ -44905,7 +44929,7 @@
           } else {
             children = originRenderCell(data);
           }
-          const shouldCreatePlaceholder = hasTreeColumn.value && data.cellIndex === 0;
+          const shouldCreatePlaceholder = hasTreeColumn.value && data.cellIndex === 0 && data.column.type !== "selection";
           const prefix = treeCellPrefix(data, shouldCreatePlaceholder);
           const props2 = {
             class: "cell",
@@ -47133,7 +47157,7 @@
               let _slot;
               return slots.cell ? vue.createVNode(CellRenderer, vue.mergeProps(props3, tableCellProps, {
                 "style": _columnsStyles[props3.column.key]
-              }), _isSlot(_slot = slots.cell()) ? _slot : {
+              }), _isSlot(_slot = slots.cell(props3)) ? _slot : {
                 default: () => [_slot]
               }) : vue.createVNode(CellRenderer, vue.mergeProps(props3, tableCellProps, {
                 "style": _columnsStyles[props3.column.key]
@@ -47146,7 +47170,7 @@
               let _slot2;
               return slots["header-cell"] ? vue.createVNode(HeaderCellRenderer, vue.mergeProps(props3, tableHeaderCellProps, {
                 "style": _columnsStyles[props3.column.key]
-              }), _isSlot(_slot2 = slots["header-cell"]()) ? _slot2 : {
+              }), _isSlot(_slot2 = slots["header-cell"](props3)) ? _slot2 : {
                 default: () => [_slot2]
               }) : vue.createVNode(HeaderCellRenderer, vue.mergeProps(props3, tableHeaderCellProps, {
                 "style": _columnsStyles[props3.column.key]
@@ -47313,14 +47337,6 @@
       default: ""
     },
     editable: Boolean,
-    onTabClick: {
-      type: definePropType(Function),
-      default: NOOP
-    },
-    onTabRemove: {
-      type: definePropType(Function),
-      default: NOOP
-    },
     type: {
       type: String,
       values: ["card", "border-card", ""],
@@ -47328,12 +47344,18 @@
     },
     stretch: Boolean
   });
+  const tabNavEmits = {
+    tabClick: (tab, tabName, ev) => ev instanceof Event,
+    tabRemove: (tab, ev) => ev instanceof Event
+  };
   const COMPONENT_NAME = "ElTabNav";
   const TabNav = vue.defineComponent({
     name: COMPONENT_NAME,
     props: tabNavProps,
+    emits: tabNavEmits,
     setup(props, {
-      expose
+      expose,
+      emit
     }) {
       const vm = vue.getCurrentInstance();
       const rootTabs = vue.inject(tabsRootContextKey);
@@ -47511,7 +47533,7 @@
           pane.index = `${index}`;
           const btnClose = closable ? vue.createVNode(ElIcon, {
             "class": "is-icon-close",
-            "onClick": (ev) => props.onTabRemove(pane, ev)
+            "onClick": (ev) => emit("tabRemove", pane, ev)
           }, {
             default: () => [vue.createVNode(close_default, null, null)]
           }) : null;
@@ -47530,11 +47552,11 @@
             "onBlur": () => removeFocus(),
             "onClick": (ev) => {
               removeFocus();
-              props.onTabClick(pane, tabName, ev);
+              emit("tabClick", pane, tabName, ev);
             },
             "onKeydown": (ev) => {
               if (closable && (ev.code === EVENT_CODE.delete || ev.code === EVENT_CODE.backspace)) {
-                props.onTabRemove(pane, ev);
+                emit("tabRemove", pane, ev);
               }
             }
           }, [...[tabLabelContent, btnClose]]);
@@ -47587,11 +47609,11 @@
   const isPanelName = (value) => isString(value) || isNumber(value);
   const tabsEmits = {
     [UPDATE_MODEL_EVENT]: (name) => isPanelName(name),
-    "tab-click": (pane, ev) => ev instanceof Event,
-    "tab-change": (name) => isPanelName(name),
+    tabClick: (pane, ev) => ev instanceof Event,
+    tabChange: (name) => isPanelName(name),
     edit: (paneName, action) => ["remove", "add"].includes(action),
-    "tab-remove": (name) => isPanelName(name),
-    "tab-add": () => true
+    tabRemove: (name) => isPanelName(name),
+    tabAdd: () => true
   };
   var Tabs = vue.defineComponent({
     name: "ElTabs",
@@ -47610,7 +47632,7 @@
       const changeCurrentName = (value) => {
         currentName.value = value;
         emit(UPDATE_MODEL_EVENT, value);
-        emit("tab-change", value);
+        emit("tabChange", value);
       };
       const setCurrentName = async (value) => {
         var _a2, _b2, _c;
@@ -47629,18 +47651,18 @@
         if (tab.props.disabled)
           return;
         setCurrentName(tabName);
-        emit("tab-click", tab, event);
+        emit("tabClick", tab, event);
       };
       const handleTabRemove = (pane, ev) => {
         if (pane.props.disabled || isUndefined(pane.props.name))
           return;
         ev.stopPropagation();
         emit("edit", pane.props.name, "remove");
-        emit("tab-remove", pane.props.name);
+        emit("tabRemove", pane.props.name);
       };
       const handleTabAdd = () => {
         emit("edit", void 0, "add");
-        emit("tab-add");
+        emit("tabAdd");
       };
       useDeprecated({
         from: '"activeName"',
@@ -49232,6 +49254,14 @@
       return data[NODE_KEY];
     return data[key];
   };
+  const handleCurrentChange = (store, emit, setCurrent) => {
+    const preCurrentNode = store.value.currentNode;
+    setCurrent();
+    const currentNode = store.value.currentNode;
+    if (preCurrentNode === currentNode)
+      return;
+    emit("current-change", currentNode ? currentNode : null, currentNode);
+  };
 
   const getChildState = (node) => {
     let all = true;
@@ -50235,9 +50265,7 @@
         oldIndeterminate.value = indeterminate;
       };
       const handleClick = (e) => {
-        const store = tree.store.value;
-        store.setCurrentNode(props.node);
-        tree.ctx.emit("current-change", store.currentNode ? store.currentNode.data : null, store.currentNode);
+        handleCurrentChange(tree.store, tree.ctx.emit, () => tree.store.value.setCurrentNode(props.node));
         tree.currentNode.value = props.node;
         if (tree.props.expandOnClickNode) {
           handleExpandIconClick();
@@ -50716,22 +50744,12 @@
       const setCurrentNode = (node, shouldAutoExpandParent = true) => {
         if (!props.nodeKey)
           throw new Error("[Tree] nodeKey is required in setCurrentNode");
-        const preNode = store.value.currentNode;
-        store.value.setUserCurrentNode(node, shouldAutoExpandParent);
-        const currNode = store.value.currentNode;
-        if (preNode !== currNode) {
-          ctx.emit("current-change", currNode ? currNode.data : null, currNode);
-        }
+        handleCurrentChange(store, ctx.emit, () => store.value.setUserCurrentNode(node, shouldAutoExpandParent));
       };
       const setCurrentKey = (key, shouldAutoExpandParent = true) => {
         if (!props.nodeKey)
           throw new Error("[Tree] nodeKey is required in setCurrentKey");
-        const preNode = store.value.currentNode;
-        store.value.setCurrentNodeKey(key, shouldAutoExpandParent);
-        const currNode = store.value.currentNode;
-        if (preNode !== currNode) {
-          ctx.emit("current-change", currNode ? currNode.data : null, currNode);
-        }
+        handleCurrentChange(store, ctx.emit, () => store.value.setCurrentNodeKey(key, shouldAutoExpandParent));
       };
       const getNode = (data) => {
         return store.value.getNode(data);
@@ -53119,23 +53137,18 @@
       var _a;
       if (options.beforeClose && !options.beforeClose())
         return;
-      const target = data.parent;
-      target.vLoadingAddClassList = void 0;
       afterLeaveFlag.value = true;
       clearTimeout(afterLeaveTimer);
-      afterLeaveTimer = window.setTimeout(() => {
-        if (afterLeaveFlag.value) {
-          afterLeaveFlag.value = false;
-          destroySelf();
-        }
-      }, 400);
+      afterLeaveTimer = window.setTimeout(handleAfterLeave, 400);
       data.visible = false;
       (_a = options.closed) == null ? void 0 : _a.call(options);
     }
     function handleAfterLeave() {
       if (!afterLeaveFlag.value)
         return;
+      const target = data.parent;
       afterLeaveFlag.value = false;
+      target.vLoadingAddClassList = void 0;
       destroySelf();
     }
     const elLoadingComponent = {
@@ -53643,7 +53656,9 @@
         vue.render(null, container);
       }
     };
-    const vnode = vue.createVNode(MessageConstructor, props, isFunction(props.message) || vue.isVNode(props.message) ? { default: props.message } : null);
+    const vnode = vue.createVNode(MessageConstructor, props, isFunction(props.message) || vue.isVNode(props.message) ? {
+      default: isFunction(props.message) ? props.message : () => props.message
+    } : null);
     vnode.appContext = context || message._context;
     vue.render(vnode, container);
     appendTo.appendChild(container.firstElementChild);
@@ -54929,6 +54944,7 @@
   exports.switchEmits = switchEmits;
   exports.switchProps = switchProps;
   exports.tabBarProps = tabBarProps;
+  exports.tabNavEmits = tabNavEmits;
   exports.tabNavProps = tabNavProps;
   exports.tabPaneProps = tabPaneProps;
   exports.tableV2Props = tableV2Props;