Fixed #4690 - MegaMenu: separate label and submenuLabel pt options

pull/4694/head
Tuğçe Küçükoğlu 2023-10-25 15:20:58 +03:00
parent 015b7eee5c
commit b6c96e83a0
3 changed files with 6 additions and 1 deletions

View File

@ -98,6 +98,10 @@ export interface MegaMenuPassThroughOptions {
* Used to pass attributes to the submenu's DOM element. * Used to pass attributes to the submenu's DOM element.
*/ */
submenu?: MegaMenuPassThroughOptionType; submenu?: MegaMenuPassThroughOptionType;
/**
* Used to pass attributes to the submenu label's DOM element.
*/
submenuLabel?: MegaMenuPassThroughOptionType;
/** /**
* Used to pass attributes to the separator's DOM element. * Used to pass attributes to the separator's DOM element.
*/ */

View File

@ -32,7 +32,7 @@
<a v-else v-ripple :href="getItemProp(processedItem, 'url')" :class="cx('action')" :target="getItemProp(processedItem, 'target')" tabindex="-1" aria-hidden="true" v-bind="getPTOptions(processedItem, index, 'action')"> <a v-else 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')]" /> <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 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 :class="level === 0 ? cx('label') : cx('submenuLabel')" v-bind="level === 0 ? getPTOptions(processedItem, index, 'label') : getPTOptions(processedItem, index, 'submenuLabel')">{{ getItemLabel(processedItem) }}</span>
<template v-if="isItemGroup(processedItem)"> <template v-if="isItemGroup(processedItem)">
<component v-if="templates.submenuicon" :is="templates.submenuicon" :active="isItemActive(processedItem)" :class="cx('submenuIcon')" v-bind="getPTOptions(processedItem, index, 'submenuIcon')" /> <component v-if="templates.submenuicon" :is="templates.submenuicon" :active="isItemActive(processedItem)" :class="cx('submenuIcon')" v-bind="getPTOptions(processedItem, index, 'submenuIcon')" />
<component v-else :is="horizontal ? 'AngleDownIcon' : 'AngleRightIcon'" :class="cx('submenuIcon')" v-bind="getPTOptions(processedItem, index, 'submenuIcon')" /> <component v-else :is="horizontal ? 'AngleDownIcon' : 'AngleRightIcon'" :class="cx('submenuIcon')" v-bind="getPTOptions(processedItem, index, 'submenuIcon')" />

View File

@ -185,6 +185,7 @@ const classes = {
return columnClass; return columnClass;
}, },
submenu: 'p-submenu-list p-megamenu-submenu', submenu: 'p-submenu-list p-megamenu-submenu',
submenuLabel: 'p-menuitem-text',
separator: 'p-menuitem-separator', separator: 'p-menuitem-separator',
end: 'p-megamenu-end' end: 'p-megamenu-end'
}; };