mirror of
https://github.com/primefaces/primevue.git
synced 2025-05-10 09:22:34 +00:00
Fixed #5288 - Menu components: track focus with also mousemove
This commit is contained in:
parent
266d5019af
commit
e67efa2d8c
10 changed files with 91 additions and 29 deletions
|
@ -20,7 +20,13 @@
|
|||
:data-p-focused="isItemFocused(processedItem)"
|
||||
:data-p-disabled="isItemDisabled(processedItem)"
|
||||
>
|
||||
<div :class="cx('content')" @click="onItemClick($event, processedItem)" @mouseenter="onItemMouseEnter($event, processedItem)" v-bind="getPTOptions(processedItem, index, 'content')">
|
||||
<div
|
||||
:class="cx('content')"
|
||||
@click="onItemClick($event, processedItem)"
|
||||
@mouseenter="onItemMouseEnter($event, processedItem)"
|
||||
@mousemove="onItemMouseMove($event, processedItem)"
|
||||
v-bind="getPTOptions(processedItem, index, 'content')"
|
||||
>
|
||||
<template v-if="!templates.item">
|
||||
<a v-ripple :href="getItemProp(processedItem, 'url')" :class="cx('action')" :target="getItemProp(processedItem, 'target')" tabindex="-1" aria-hidden="true" v-bind="getPTOptions(processedItem, index, 'action')">
|
||||
<component v-if="templates.itemicon" :is="templates.itemicon" :item="processedItem.item" :class="cx('icon')" />
|
||||
|
@ -51,6 +57,7 @@
|
|||
:unstyled="unstyled"
|
||||
@item-click="$emit('item-click', $event)"
|
||||
@item-mouseenter="$emit('item-mouseenter', $event)"
|
||||
@item-mousemove="$emit('item-mousemove', $event)"
|
||||
/>
|
||||
</li>
|
||||
<li
|
||||
|
@ -77,7 +84,7 @@ export default {
|
|||
name: 'TieredMenuSub',
|
||||
hostName: 'TieredMenu',
|
||||
extends: BaseComponent,
|
||||
emits: ['item-click', 'item-mouseenter'],
|
||||
emits: ['item-click', 'item-mouseenter', 'item-mousemove'],
|
||||
container: null,
|
||||
props: {
|
||||
menuId: {
|
||||
|
@ -165,6 +172,9 @@ export default {
|
|||
onItemMouseEnter(event, processedItem) {
|
||||
this.$emit('item-mouseenter', { originalEvent: event, processedItem });
|
||||
},
|
||||
onItemMouseMove(event, processedItem) {
|
||||
this.$emit('item-mousemove', { originalEvent: event, processedItem });
|
||||
},
|
||||
getAriaSetSize() {
|
||||
return this.items.filter((processedItem) => this.isItemVisible(processedItem) && !this.getItemProp(processedItem, 'separator')).length;
|
||||
},
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue