123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101 |
- 'use strict';
- Object.defineProperty(exports, '__esModule', { value: true });
- var vue = require('vue');
- var index = require('../../icon/index.js');
- var dropdown = require('./dropdown.js');
- var tokens = require('./tokens.js');
- var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
- var rovingFocusGroup = require('../../roving-focus-group/src/roving-focus-group.js');
- var tokens$1 = require('../../roving-focus-group/src/tokens.js');
- var collection = require('../../collection/src/collection.js');
- var index$1 = require('../../../hooks/use-namespace/index.js');
- var refs = require('../../../utils/vue/refs.js');
- var event = require('../../../utils/dom/event.js');
- var aria = require('../../../constants/aria.js');
- const _sfc_main = vue.defineComponent({
- name: "DropdownItemImpl",
- components: {
- ElIcon: index.ElIcon
- },
- props: dropdown.dropdownItemProps,
- emits: ["pointermove", "pointerleave", "click", "clickimpl"],
- setup(_, { emit }) {
- const ns = index$1.useNamespace("dropdown");
- const { role: menuRole } = vue.inject(tokens.DROPDOWN_INJECTION_KEY, void 0);
- const { collectionItemRef: dropdownCollectionItemRef } = vue.inject(dropdown.DROPDOWN_COLLECTION_ITEM_INJECTION_KEY, void 0);
- const { collectionItemRef: rovingFocusCollectionItemRef } = vue.inject(rovingFocusGroup.ROVING_FOCUS_ITEM_COLLECTION_INJECTION_KEY, void 0);
- const {
- rovingFocusGroupItemRef,
- tabIndex,
- handleFocus,
- handleKeydown: handleItemKeydown,
- handleMousedown
- } = vue.inject(tokens$1.ROVING_FOCUS_GROUP_ITEM_INJECTION_KEY, void 0);
- const itemRef = refs.composeRefs(dropdownCollectionItemRef, rovingFocusCollectionItemRef, rovingFocusGroupItemRef);
- const role = vue.computed(() => {
- if (menuRole.value === "menu") {
- return "menuitem";
- } else if (menuRole.value === "navigation") {
- return "link";
- }
- return "button";
- });
- const handleKeydown = event.composeEventHandlers((e) => {
- if ([aria.EVENT_CODE.enter, aria.EVENT_CODE.numpadEnter, aria.EVENT_CODE.space].includes(e.code)) {
- e.preventDefault();
- e.stopImmediatePropagation();
- emit("clickimpl", e);
- return true;
- }
- }, handleItemKeydown);
- return {
- ns,
- itemRef,
- dataset: {
- [collection.COLLECTION_ITEM_SIGN]: ""
- },
- role,
- tabIndex,
- handleFocus,
- handleKeydown,
- handleMousedown
- };
- }
- });
- function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
- const _component_el_icon = vue.resolveComponent("el-icon");
- return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
- _ctx.divided ? (vue.openBlock(), vue.createElementBlock("li", {
- key: 0,
- role: "separator",
- class: vue.normalizeClass(_ctx.ns.bem("menu", "item", "divided"))
- }, null, 2)) : vue.createCommentVNode("v-if", true),
- vue.createElementVNode("li", vue.mergeProps({ ref: _ctx.itemRef }, { ..._ctx.dataset, ..._ctx.$attrs }, {
- "aria-disabled": _ctx.disabled,
- class: [_ctx.ns.be("menu", "item"), _ctx.ns.is("disabled", _ctx.disabled)],
- tabindex: _ctx.tabIndex,
- role: _ctx.role,
- onClick: (e) => _ctx.$emit("clickimpl", e),
- onFocus: _ctx.handleFocus,
- onKeydown: vue.withModifiers(_ctx.handleKeydown, ["self"]),
- onMousedown: _ctx.handleMousedown,
- onPointermove: (e) => _ctx.$emit("pointermove", e),
- onPointerleave: (e) => _ctx.$emit("pointerleave", e)
- }), [
- _ctx.icon ? (vue.openBlock(), vue.createBlock(_component_el_icon, { key: 0 }, {
- default: vue.withCtx(() => [
- (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.icon)))
- ]),
- _: 1
- })) : vue.createCommentVNode("v-if", true),
- vue.renderSlot(_ctx.$slots, "default")
- ], 16, ["aria-disabled", "tabindex", "role", "onClick", "onFocus", "onKeydown", "onMousedown", "onPointermove", "onPointerleave"])
- ], 64);
- }
- var ElDropdownItemImpl = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["render", _sfc_render], ["__file", "dropdown-item-impl.vue"]]);
- exports["default"] = ElDropdownItemImpl;
- //# sourceMappingURL=dropdown-item-impl.js.map
|