refactor: #7090 for ContextMenu
parent
e4d4d5cdcf
commit
6148817917
|
@ -4,14 +4,14 @@
|
||||||
<div v-if="visible" :ref="containerRef" :class="cx('root')" v-bind="ptmi('root')">
|
<div v-if="visible" :ref="containerRef" :class="cx('root')" v-bind="ptmi('root')">
|
||||||
<ContextMenuSub
|
<ContextMenuSub
|
||||||
:ref="listRef"
|
:ref="listRef"
|
||||||
:id="id + '_list'"
|
:id="$id + '_list'"
|
||||||
:class="cx('rootList')"
|
:class="cx('rootList')"
|
||||||
role="menubar"
|
role="menubar"
|
||||||
:root="true"
|
:root="true"
|
||||||
:tabindex="tabindex"
|
:tabindex="tabindex"
|
||||||
aria-orientation="vertical"
|
aria-orientation="vertical"
|
||||||
:aria-activedescendant="focused ? focusedItemIdx : undefined"
|
:aria-activedescendant="focused ? focusedItemIdx : undefined"
|
||||||
:menuId="id"
|
:menuId="$id"
|
||||||
:focusedItemId="focused ? focusedItemIdx : undefined"
|
:focusedItemId="focused ? focusedItemIdx : undefined"
|
||||||
:items="processedItems"
|
:items="processedItems"
|
||||||
:templates="$slots"
|
:templates="$slots"
|
||||||
|
@ -38,7 +38,6 @@
|
||||||
import { addStyle, findSingle, focus, getHiddenElementOuterHeight, getHiddenElementOuterWidth, getViewport, isTouchDevice } from '@primeuix/utils/dom';
|
import { addStyle, findSingle, focus, getHiddenElementOuterHeight, getHiddenElementOuterWidth, getViewport, isTouchDevice } from '@primeuix/utils/dom';
|
||||||
import { findLastIndex, isEmpty, isNotEmpty, isPrintableCharacter, resolve } from '@primeuix/utils/object';
|
import { findLastIndex, isEmpty, isNotEmpty, isPrintableCharacter, resolve } from '@primeuix/utils/object';
|
||||||
import { ZIndex } from '@primeuix/utils/zindex';
|
import { ZIndex } from '@primeuix/utils/zindex';
|
||||||
import { UniqueComponentId } from '@primevue/core/utils';
|
|
||||||
import Portal from 'primevue/portal';
|
import Portal from 'primevue/portal';
|
||||||
import BaseContextMenu from './BaseContextMenu.vue';
|
import BaseContextMenu from './BaseContextMenu.vue';
|
||||||
import ContextMenuSub from './ContextMenuSub.vue';
|
import ContextMenuSub from './ContextMenuSub.vue';
|
||||||
|
@ -59,7 +58,6 @@ export default {
|
||||||
list: null,
|
list: null,
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
id: this.$attrs.id,
|
|
||||||
focused: false,
|
focused: false,
|
||||||
focusedItemInfo: { index: -1, level: 0, parentKey: '' },
|
focusedItemInfo: { index: -1, level: 0, parentKey: '' },
|
||||||
activeItemPath: [],
|
activeItemPath: [],
|
||||||
|
@ -70,9 +68,6 @@ export default {
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
'$attrs.id': function (newValue) {
|
|
||||||
this.id = newValue || UniqueComponentId();
|
|
||||||
},
|
|
||||||
activeItemPath(newPath) {
|
activeItemPath(newPath) {
|
||||||
if (isNotEmpty(newPath)) {
|
if (isNotEmpty(newPath)) {
|
||||||
this.bindOutsideClickListener();
|
this.bindOutsideClickListener();
|
||||||
|
@ -84,7 +79,6 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.id = this.id || UniqueComponentId();
|
|
||||||
this.bindMatchMediaListener();
|
this.bindMatchMediaListener();
|
||||||
|
|
||||||
if (this.global) {
|
if (this.global) {
|
||||||
|
@ -579,7 +573,7 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
scrollInView(index = -1) {
|
scrollInView(index = -1) {
|
||||||
const id = index !== -1 ? `${this.id}_${index}` : this.focusedItemIdx;
|
const id = index !== -1 ? `${this.$id}_${index}` : this.focusedItemIdx;
|
||||||
const element = findSingle(this.list, `li[id="${id}"]`);
|
const element = findSingle(this.list, `li[id="${id}"]`);
|
||||||
|
|
||||||
if (element) {
|
if (element) {
|
||||||
|
@ -624,7 +618,7 @@ export default {
|
||||||
return processedItem ? processedItem.items : this.processedItems;
|
return processedItem ? processedItem.items : this.processedItems;
|
||||||
},
|
},
|
||||||
focusedItemIdx() {
|
focusedItemIdx() {
|
||||||
return this.focusedItemInfo.index !== -1 ? `${this.id}${isNotEmpty(this.focusedItemInfo.parentKey) ? '_' + this.focusedItemInfo.parentKey : ''}_${this.focusedItemInfo.index}` : null;
|
return this.focusedItemInfo.index !== -1 ? `${this.$id}${isNotEmpty(this.focusedItemInfo.parentKey) ? '_' + this.focusedItemInfo.parentKey : ''}_${this.focusedItemInfo.index}` : null;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
|
|
Loading…
Reference in New Issue