vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

aria-labelledby enhancements for submenus

pull/5011/head
tugcekucukoglu 2023-12-28 11:04:57 +03:00
parent c1a78ef922
commit 6d6516cc61
2 changed files with 11 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
components/lib/contextmenu/ContextMenuSub.vue
View File

@ -25,7 +25,7 @@
<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)">
<component v-if="templates.itemicon" :is="templates.itemicon" :item="processedItem.item" :class="[cx('icon'), getItemProp(processedItem, 'icon')]" />
<span v-else-if="getItemProp(processedItem, 'icon')" :class="[cx('icon'), getItemProp(processedItem, 'icon')]" v-bind="getPTOptions('icon', processedItem, index)" />
<span :class="cx('label')" v-bind="getPTOptions('label', processedItem, index)">{{ getItemLabel(processedItem) }}</span>
<span :id="getItemLabelId(processedItem)" :class="cx('label')" v-bind="getPTOptions('label', processedItem, index)">{{ getItemLabel(processedItem) }}</span>
<template v-if="getItemProp(processedItem, 'items')">
<component v-if="templates.submenuicon" :is="templates.submenuicon" :active="isItemActive(processedItem)" :class="cx('submenuIcon')" />
<AngleRightIcon v-else :class="cx('submenuIcon')" v-bind="getPTOptions('submenuicon', processedItem, index)" />
@ -50,6 +50,7 @@
:unstyled="unstyled"
@item-click="$emit('item-click', $event)"
@item-mouseenter="$emit('item-mouseenter', $event)"
:aria-labelledby="getItemLabelId(processedItem)"
v-bind="ptm('submenu')"
/>
</li>
@ -129,6 +130,9 @@ export default {
getItemLabel(processedItem) {
return this.getItemProp(processedItem, 'label');
},
getItemLabelId(processedItem) {
return `${this.menuId}_${processedItem.key}_label`;
},
getPTOptions(key, processedItem, index) {
return this.ptm(key, {
context: {
@ -202,6 +206,7 @@ export default {
};
}
},
components: {
AngleRightIcon: AngleRightIcon
},

6
components/lib/menubar/MenubarSub.vue
View File

@ -24,7 +24,7 @@
<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'), getItemProp(processedItem, 'icon')]" />
<span v-else-if="getItemProp(processedItem, 'icon')" :class="[cx('icon'), getItemProp(processedItem, 'icon')]" v-bind="getPTOptions(processedItem, index, 'icon')" />
<span :class="cx('label')" v-bind="getPTOptions(processedItem, index, 'label')">{{ getItemLabel(processedItem) }}</span>
<span :id="getItemLabelId(processedItem)" :class="cx('label')" v-bind="getPTOptions(processedItem, index, 'label')">{{ getItemLabel(processedItem) }}</span>
<template v-if="getItemProp(processedItem, 'items')">
<component v-if="templates.submenuicon" :is="templates.submenuicon" :root="root" :active="isItemActive(processedItem)" :class="cx('submenuIcon')" />
<component v-else :is="root ? 'AngleDownIcon' : 'AngleRightIcon'" :class="cx('submenuIcon')" v-bind="getPTOptions(processedItem, index, 'submenuIcon')" />
@ -44,6 +44,7 @@
:activeItemPath="activeItemPath"
:templates="templates"
:level="level + 1"
:aria-labelledby="getItemLabelId(processedItem)"
:pt="pt"
:unstyled="unstyled"
@item-click="$emit('item-click', $event)"
@ -127,6 +128,9 @@ export default {
getItemLabel(processedItem) {
return this.getItemProp(processedItem, 'label');
},
getItemLabelId(processedItem) {
return `${this.menuId}_${processedItem.key}_label`;
},
getPTOptions(processedItem, index, key) {
return this.ptm(key, {
context: {