@element-plus/nightly 0.0.20240229 → 0.0.20240301

package/dist/index.full.js

@@ -1,4 +1,4 @@
-/*! Element Plus v0.0.20240229 */
+/*! Element Plus v0.0.20240301 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -8637,6 +8637,7 @@
 
   const datePickTypes = [
     "year",
+    "years",
     "month",
     "date",
     "dates",
@@ -11642,7 +11643,7 @@
 
   const ElConfigProvider = withInstall(ConfigProvider);
 
-  const version$1 = "0.0.20240229";
+  const version$1 = "0.0.20240301";
 
   const makeInstaller = (components = []) => {
     const install = (app, options) => {
@@ -18696,6 +18697,7 @@
     dates: DEFAULT_FORMATS_DATE,
     week: "gggg[w]ww",
     year: "YYYY",
+    years: "YYYY",
     month: "YYYY-MM",
     datetime: `${DEFAULT_FORMATS_DATE} ${DEFAULT_FORMATS_TIME}`,
     monthrange: "YYYY-MM",
@@ -19106,13 +19108,14 @@
         if (!pickerVisible.value && valueIsEmpty.value)
           return "";
         if (formattedValue) {
-          return isDatesPicker.value ? formattedValue.join(", ") : formattedValue;
+          return isDatesPicker.value || isYearsPicker.value ? formattedValue.join(", ") : formattedValue;
         }
         return "";
       });
       const isTimeLikePicker = vue.computed(() => props.type.includes("time"));
       const isTimePicker = vue.computed(() => props.type.startsWith("time"));
       const isDatesPicker = vue.computed(() => props.type === "dates");
+      const isYearsPicker = vue.computed(() => props.type === "years");
       const triggerIcon = vue.computed(() => props.prefixIcon || (isTimeLikePicker.value ? clock_default : calendar_default));
       const showClose = vue.ref(false);
       const onClearIconClick = (event) => {
@@ -19372,7 +19375,7 @@
               placeholder: _ctx.placeholder,
               class: vue.normalizeClass([vue.unref(nsDate).b("editor"), vue.unref(nsDate).bm("editor", _ctx.type), _ctx.$attrs.class]),
               style: vue.normalizeStyle(_ctx.$attrs.style),
-              readonly: !_ctx.editable || _ctx.readonly || vue.unref(isDatesPicker) || _ctx.type === "week",
+              readonly: !_ctx.editable || _ctx.readonly || vue.unref(isDatesPicker) || vue.unref(isYearsPicker) || _ctx.type === "week",
               label: _ctx.label,
               tabindex: _ctx.tabindex,
               "validate-event": false,
@@ -26524,7 +26527,15 @@
     }
   });
 
-  const selectionModes = ["date", "dates", "year", "month", "week", "range"];
+  const selectionModes = [
+    "date",
+    "dates",
+    "year",
+    "years",
+    "month",
+    "week",
+    "range"
+  ];
   const datePickerSharedProps = buildProps({
     disabledDate: {
       type: definePropType(Function)
@@ -27330,7 +27341,8 @@
   const basicYearTableProps = buildProps({
     date,
     disabledDate,
-    parsedValue
+    parsedValue,
+    selectionMode: selectionModeWithDefault("year")
   });
 
   const _hoisted_1$K = ["aria-label"];
@@ -27369,7 +27381,7 @@
         return kls;
       };
       const isSelectedCell = (year) => {
-        return year === startYear.value && props.date.year() < startYear.value && props.date.year() > startYear.value + 9 || castArray(props.date).findIndex((date) => date.year() === year) >= 0;
+        return year === startYear.value && props.date.year() < startYear.value && props.date.year() > startYear.value + 9 || castArray(props.date).findIndex((date) => date.year() === year) >= 0 || castArray(props.parsedValue).findIndex((date) => (date == null ? void 0 : date.year()) === year) >= 0;
       };
       const handleYearTableClick = (event) => {
         const clickTarget = event.target;
@@ -27378,7 +27390,16 @@
           if (hasClass(target, "disabled"))
             return;
           const year = target.textContent || target.innerText;
-          emit("pick", Number(year));
+          if (props.selectionMode === "years") {
+            if (event.type === "keydown") {
+              emit("pick", castArray(props.parsedValue), false);
+              return;
+            }
+            const newValue = hasClass(target, "current") ? castArray(props.parsedValue).filter((d) => (d == null ? void 0 : d.year()) !== Number(year)) : castArray(props.parsedValue).concat([dayjs(year)]);
+            emit("pick", newValue);
+          } else {
+            emit("pick", Number(year));
+          }
         }
       };
       vue.watch(() => props.date, async () => {
@@ -27420,7 +27441,9 @@
                         vue.withKeys(vue.withModifiers(handleYearTableClick, ["prevent", "stop"]), ["enter"])
                       ]
                     }, [
-                      vue.createElementVNode("span", _hoisted_3$d, vue.toDisplayString(vue.unref(startYear) + i * 4 + j), 1)
+                      vue.createElementVNode("div", null, [
+                        vue.createElementVNode("span", _hoisted_3$d, vue.toDisplayString(vue.unref(startYear) + i * 4 + j), 1)
+                      ])
                     ], 42, _hoisted_2$s)) : (vue.openBlock(), vue.createElementBlock("td", _hoisted_4$9))
                   ], 64);
                 }), 64))
@@ -27554,7 +27577,7 @@
       };
       const selectionMode = vue.computed(() => {
         const { type } = props;
-        if (["week", "month", "year", "dates"].includes(type))
+        if (["week", "month", "year", "years", "dates"].includes(type))
           return type;
         return "date";
       });
@@ -27576,10 +27599,12 @@
         }
         handlePanelChange("month");
       };
-      const handleYearPick = async (year2) => {
+      const handleYearPick = async (year2, keepOpen) => {
         if (selectionMode.value === "year") {
           innerDate.value = innerDate.value.startOf("year").year(year2);
           emit(innerDate.value, false);
+        } else if (selectionMode.value === "years") {
+          emit(year2, keepOpen != null ? keepOpen : true);
         } else {
           innerDate.value = innerDate.value.year(year2);
           currentView.value = "month";
@@ -27598,7 +27623,11 @@
       };
       const showTime = vue.computed(() => props.type === "datetime" || props.type === "datetimerange");
       const footerVisible = vue.computed(() => {
-        return showTime.value || selectionMode.value === "dates";
+        const showDateFooter = showTime.value || selectionMode.value === "dates";
+        const showYearFooter = selectionMode.value === "years";
+        const isDateView = currentView.value === "date";
+        const isYearView = currentView.value === "year";
+        return showDateFooter && isDateView || showYearFooter && isYearView;
       });
       const disabledConfirm = vue.computed(() => {
         if (!disabledDate)
@@ -27611,7 +27640,7 @@
         return disabledDate(props.parsedValue.toDate());
       });
       const onConfirm = () => {
-        if (selectionMode.value === "dates") {
+        if (selectionMode.value === "dates" || selectionMode.value === "years") {
           emit(props.parsedValue);
         } else {
           let result = props.parsedValue;
@@ -27710,10 +27739,7 @@
         return dayjs.isDayjs(date) && date.isValid() && (disabledDate ? !disabledDate(date.toDate()) : true);
       };
       const formatToString = (value) => {
-        if (selectionMode.value === "dates") {
-          return value.map((_) => _.format(props.format));
-        }
-        return value.format(props.format);
+        return Array.isArray(value) ? value.map((_) => _.format(props.format)) : value.format(props.format);
       };
       const parseUserInput = (value) => {
         return dayjs(value, props.format).locale(lang.value);
@@ -27816,6 +27842,9 @@
         if (["month", "year"].includes(val)) {
           currentView.value = val;
           return;
+        } else if (val === "years") {
+          currentView.value = "year";
+          return;
         }
         currentView.value = "date";
       }, { immediate: true });
@@ -27829,7 +27858,7 @@
       }, { immediate: true });
       vue.watch(() => props.parsedValue, (val) => {
         if (val) {
-          if (selectionMode.value === "dates")
+          if (selectionMode.value === "dates" || selectionMode.value === "years")
             return;
           if (Array.isArray(val))
             return;
@@ -28026,11 +28055,12 @@
                   key: 1,
                   ref_key: "currentViewRef",
                   ref: currentViewRef,
+                  "selection-mode": vue.unref(selectionMode),
                   date: innerDate.value,
                   "disabled-date": vue.unref(disabledDate),
                   "parsed-value": _ctx.parsedValue,
                   onPick: handleYearPick
-                }, null, 8, ["date", "disabled-date", "parsed-value"])) : vue.createCommentVNode("v-if", true),
+                }, null, 8, ["selection-mode", "date", "disabled-date", "parsed-value"])) : vue.createCommentVNode("v-if", true),
                 currentView.value === "month" ? (vue.openBlock(), vue.createBlock(MonthTable, {
                   key: 2,
                   ref_key: "currentViewRef",
@@ -28058,7 +28088,7 @@
               ]),
               _: 1
             }, 8, ["class", "disabled"]), [
-              [vue.vShow, vue.unref(selectionMode) !== "dates"]
+              [vue.vShow, vue.unref(selectionMode) !== "dates" && vue.unref(selectionMode) !== "years"]
             ]),
             vue.createVNode(vue.unref(ElButton), {
               plain: "",
@@ -28073,7 +28103,7 @@
               _: 1
             }, 8, ["class", "disabled"])
           ], 2), [
-            [vue.vShow, vue.unref(footerVisible) && currentView.value === "date"]
+            [vue.vShow, vue.unref(footerVisible)]
           ])
         ], 2);
       };
@@ -34257,8 +34287,9 @@
       formItemContext: formItem
     });
     const selectDisabled = vue.computed(() => props.disabled || (form == null ? void 0 : form.disabled));
+    const hasEmptyStringOption = vue.computed(() => optionsArray.value.some((option) => option.value === ""));
     const hasModelValue = vue.computed(() => {
-      return props.multiple ? isArray$1(props.modelValue) && props.modelValue.length > 0 : props.modelValue !== void 0 && props.modelValue !== null && props.modelValue !== "";
+      return props.multiple ? isArray$1(props.modelValue) && props.modelValue.length > 0 : !isNil(props.modelValue) && (props.modelValue !== "" || hasEmptyStringOption.value);
     });
     const showClose = vue.computed(() => {
       const criteria = props.clearable && !selectDisabled.value && states.inputHovering && hasModelValue.value;
@@ -34532,8 +34563,8 @@
     };
     const deleteSelected = (event) => {
       event.stopPropagation();
-      const value = props.multiple ? [] : "";
-      if (!isString$1(value)) {
+      const value = props.multiple ? [] : void 0;
+      if (props.multiple) {
         for (const item of states.selected) {
           if (item.isDisabled)
             value.push(item.value);
@@ -39471,8 +39502,9 @@
       const totalHeight = filteredOptions.value.length * props.itemHeight;
       return totalHeight > props.height ? props.height : totalHeight;
     });
+    const hasEmptyStringOption = vue.computed(() => allOptions.value.some((option) => getValue(option) === ""));
     const hasModelValue = vue.computed(() => {
-      return props.multiple ? isArray$1(props.modelValue) && props.modelValue.length > 0 : props.modelValue !== void 0 && props.modelValue !== null && props.modelValue !== "";
+      return props.multiple ? isArray$1(props.modelValue) && props.modelValue.length > 0 : !isNil(props.modelValue) && (props.modelValue !== "" || hasEmptyStringOption.value);
     });
     const showClearBtn = vue.computed(() => {
       const criteria = props.clearable && !selectDisabled.value && states.inputHovering && hasModelValue.value;
@@ -45929,10 +45961,7 @@
       type: String,
       default: "fixed"
     },
-    scrollbarAlwaysOn: {
-      type: Boolean,
-      default: false
-    },
+    scrollbarAlwaysOn: Boolean,
     flexible: Boolean,
     showOverflowTooltip: [Boolean, Object]
   };
@@ -53337,7 +53366,9 @@
     function setCheckedKeys(keys) {
       checkedKeys.value.clear();
       indeterminateKeys.value.clear();
-      _setCheckedKeys(keys);
+      vue.nextTick(() => {
+        _setCheckedKeys(keys);
+      });
     }
     function setChecked(key, isChecked2) {
       if ((tree == null ? void 0 : tree.value) && props.showCheckbox) {