vertumnus/primevue-mirror
1
0
Fork 0
mirror of https://github.com/primefaces/primevue.git synced 2025-05-09 00:42:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

Fixed #5288 - Menu components: track focus with also mousemove

Browse source
This commit is contained in:
tugcekucukoglu 2024-02-15 18:57:40 +03:00
parent 266d5019af
commit e67efa2d8c
10 changed files with 91 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

6
components/lib/panelmenu/PanelMenuList.vue
View file

@ -14,6 +14,7 @@
@blur="onBlur"
@keydown="onKeyDown"
@item-toggle="onItemToggle"
@item-mousemove="onItemMouseMove"
:pt="pt"
:unstyled="unstyled"
v-bind="ptm('menu')"
@ -225,6 +226,11 @@ export default {
this.focusedItem = processedItem;
DomHandler.focus(this.$el);
},
onItemMouseMove(event) {
if (this.focused) {
this.focusedItem = event.processedItem;
}
},
isElementInPanel(event, element) {
const panel = event.currentTarget.closest('[data-pc-section="panel"]');

8
components/lib/panelmenu/PanelMenuSub.vue
View file

@ -16,7 +16,7 @@
:data-p-focused="isItemFocused(processedItem)"
:data-p-disabled="isItemDisabled(processedItem)"
>
<div :class="cx('content')" @click="onItemClick($event, processedItem)" v-bind="getPTOptions('content', processedItem, index)">
<div :class="cx('content')" @click="onItemClick($event, processedItem)" @mousemove="onItemMouseMove($event, processedItem)" v-bind="getPTOptions('content', processedItem, index)">
<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('action', processedItem, index)">
<template v-if="isItemGroup(processedItem)">
@ -52,6 +52,7 @@
:templates="templates"
:activeItemPath="activeItemPath"
@item-toggle="onItemToggle"
@item-mousemove="$emit('item-mousemove', $event)"
:pt="pt"
:unstyled="unstyled"
v-bind="ptm('submenu')"
@ -82,7 +83,7 @@ export default {
name: 'PanelMenuSub',
hostName: 'PanelMenu',
extends: BaseComponent,
emits: ['item-toggle'],
emits: ['item-toggle', 'item-mousemove'],
props: {
panelId: {
type: String,
@ -159,6 +160,9 @@ export default {
onItemToggle(event) {
this.$emit('item-toggle', event);
},
onItemMouseMove(event, processedItem) {
this.$emit('item-mousemove', { originalEvent: event, processedItem });
},
getAriaSetSize() {
return this.items.filter((processedItem) => this.isItemVisible(processedItem) && !this.getItemProp(processedItem, 'separator')).length;
},