@element-plus/nightly 0.0.20240812 → 0.0.20240813

package/dist/index.full.js

@@ -1,4 +1,4 @@
-/*! Element Plus v0.0.20240812 */
+/*! Element Plus v0.0.20240813 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -11559,7 +11559,7 @@
 
   const ElConfigProvider = withInstall(ConfigProvider);
 
-  const version$1 = "0.0.20240812";
+  const version$1 = "0.0.20240813";
 
   const makeInstaller = (components = []) => {
     const install = (app, options) => {
@@ -30513,7 +30513,8 @@
       const overlayEvent = useSameTarget(onModalClick);
       const draggable = vue.computed(() => props.draggable && !props.fullscreen);
       const resetPostion = () => {
-        dialogContentRef.value.resetPostion();
+        var _a;
+        (_a = dialogContentRef.value) == null ? void 0 : _a.resetPostion();
       };
       expose({
         visible,
@@ -57332,7 +57333,9 @@
       default: () => []
     },
     loading: Boolean,
-    disabled: Boolean
+    disabled: Boolean,
+    contentId: String,
+    ariaLabel: String
   });
   const mentionDropdownEmits = {
     select: (option) => isString$1(option.value)
@@ -57419,6 +57422,7 @@
         immediate: true
       });
       expose({
+        hoveringIndex,
         navigateOptions,
         selectHoverOption,
         hoverOption
@@ -57436,20 +57440,28 @@
             vue.renderSlot(_ctx.$slots, "header")
           ], 2)) : vue.createCommentVNode("v-if", true),
           vue.withDirectives(vue.createVNode(vue.unref(ElScrollbar), {
+            id: _ctx.contentId,
             ref_key: "scrollbarRef",
             ref: scrollbarRef,
             tag: "ul",
             "wrap-class": vue.unref(ns).be("dropdown", "wrap"),
-            "view-class": vue.unref(ns).be("dropdown", "list")
+            "view-class": vue.unref(ns).be("dropdown", "list"),
+            role: "listbox",
+            "aria-label": _ctx.ariaLabel,
+            "aria-orientation": "vertical"
           }, {
             default: vue.withCtx(() => [
               (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.options, (item, index) => {
                 return vue.openBlock(), vue.createElementBlock("li", {
+                  id: `${_ctx.contentId}-${index}`,
                   ref_for: true,
                   ref_key: "optionRefs",
                   ref: optionRefs,
                   key: item.value,
                   class: vue.normalizeClass(optionkls(item, index)),
+                  role: "option",
+                  "aria-disabled": item.disabled || _ctx.disabled || void 0,
+                  "aria-selected": hoveringIndex.value === index,
                   onMouseenter: ($event) => handleMouseEnter(index),
                   onClick: vue.withModifiers(($event) => handleSelect(item), ["stop"])
                 }, [
@@ -57462,11 +57474,11 @@
                       vue.createElementVNode("span", null, vue.toDisplayString((_a = item.label) != null ? _a : item.value), 1)
                     ];
                   })
-                ], 42, ["onMouseenter", "onClick"]);
+                ], 42, ["id", "aria-disabled", "aria-selected", "onMouseenter", "onClick"]);
               }), 128))
             ]),
             _: 3
-          }, 8, ["wrap-class", "view-class"]), [
+          }, 8, ["id", "wrap-class", "view-class", "aria-label"]), [
             [vue.vShow, _ctx.options.length > 0 && !_ctx.loading]
           ]),
           _ctx.loading ? (vue.openBlock(), vue.createElementBlock("div", {
@@ -57500,6 +57512,7 @@
       const props = __props;
       const passInputProps = vue.computed(() => pick(props, Object.keys(inputProps)));
       const ns = useNamespace("mention");
+      const contentId = useId();
       const elInputRef = vue.ref();
       const tooltipRef = vue.ref();
       const dropdownRef = vue.ref();
@@ -57514,6 +57527,13 @@
           return options;
         return options.filter((option) => filterOption(mentionCtx.value.pattern, option));
       });
+      const dropdownVisible = vue.computed(() => {
+        return visible.value && (!!filteredOptions.value.length || props.loading);
+      });
+      const hoveringId = vue.computed(() => {
+        var _a;
+        return `${contentId.value}-${(_a = dropdownRef.value) == null ? void 0 : _a.hoveringIndex}`;
+      });
       const handleInputChange = (value) => {
         emit("update:modelValue", value);
         syncAfterCursorMove();
@@ -57541,6 +57561,11 @@
           } else {
             visible.value = false;
           }
+        } else if (["Escape"].includes(e.key)) {
+          if (!visible.value)
+            return;
+          e.preventDefault();
+          visible.value = false;
         } else if (["Backspace"].includes(e.key)) {
           if (props.whole && mentionCtx.value) {
             const { splitIndex, selectionEnd, pattern, prefixIndex, prefix } = mentionCtx.value;
@@ -57659,6 +57684,13 @@
             ref_key: "elInputRef",
             ref: elInputRef,
             "model-value": _ctx.modelValue,
+            role: vue.unref(dropdownVisible) ? "combobox" : void 0,
+            "aria-activedescendant": vue.unref(dropdownVisible) ? vue.unref(hoveringId) || "" : void 0,
+            "aria-controls": vue.unref(dropdownVisible) ? vue.unref(contentId) : void 0,
+            "aria-expanded": vue.unref(dropdownVisible) || void 0,
+            "aria-label": _ctx.ariaLabel,
+            "aria-autocomplete": vue.unref(dropdownVisible) ? "none" : void 0,
+            "aria-haspopup": vue.unref(dropdownVisible) ? "listbox" : void 0,
             onInput: handleInputChange,
             onKeydown: handleInputKeyDown,
             onMousedown: handleInputMouseDown
@@ -57671,11 +57703,11 @@
                 ])
               };
             })
-          ]), 1040, ["model-value"]),
+          ]), 1040, ["model-value", "role", "aria-activedescendant", "aria-controls", "aria-expanded", "aria-label", "aria-autocomplete", "aria-haspopup"]),
           vue.createVNode(vue.unref(ElTooltip), {
             ref_key: "tooltipRef",
             ref: tooltipRef,
-            visible: visible.value && (!!vue.unref(filteredOptions).length || _ctx.loading),
+            visible: vue.unref(dropdownVisible),
             "popper-class": [vue.unref(ns).e("popper"), _ctx.popperClass],
             "popper-options": _ctx.popperOptions,
             placement: vue.unref(computedPlacement),
@@ -57699,6 +57731,8 @@
                   options: vue.unref(filteredOptions),
                   disabled: _ctx.disabled,
                   loading: _ctx.loading,
+                  "content-id": vue.unref(contentId),
+                  "aria-label": _ctx.ariaLabel,
                   onSelect: handleSelect,
                   onClick: vue.withModifiers((_a = elInputRef.value) == null ? void 0 : _a.focus, ["stop"])
                 }, vue.createSlots({ _: 2 }, [
@@ -57710,7 +57744,7 @@
                       ])
                     };
                   })
-                ]), 1032, ["options", "disabled", "loading", "onClick"])
+                ]), 1032, ["options", "disabled", "loading", "content-id", "aria-label", "onClick"])
               ];
             }),
             _: 3