feat(NavigationMenu): handle item.trailingIcon display

This commit is contained in:
Benjamin Canac
2024-12-05 16:21:42 +01:00
parent 816bb69deb
commit 4b653ef773
2 changed files with 4 additions and 2 deletions

View File

@@ -52,7 +52,8 @@ const items = [
label: 'NavigationMenu',
icon: 'i-lucide-file',
description: 'Display a list of links.',
to: '/components/navigation-menu'
to: '/components/navigation-menu',
trailingIcon: 'i-lucide-check'
}, {
label: 'Pagination',
icon: 'i-lucide-file',

View File

@@ -187,7 +187,7 @@ const lists = computed(() => props.items?.length ? (Array.isArray(props.items[0]
<UIcon v-if="item.target === '_blank'" :name="appConfig.ui.icons.external" :class="ui.linkLabelExternalIcon({ class: props.ui?.linkLabelExternalIcon, active })" />
</span>
<span v-if="item.badge || item.children?.length || !!slots[item.slot ? `${item.slot}-trailing` : 'item-trailing']" :class="ui.linkTrailing({ class: props.ui?.linkTrailing })">
<span v-if="item.badge || (orientation === 'horizontal' && (item.children?.length || !!slots[item.slot ? `${item.slot}-content` : 'item-content'])) || (orientation === 'vertical' && item.children?.length) || item.trailingIcon || !!slots[item.slot ? `${item.slot}-trailing` : 'item-trailing']" :class="ui.linkTrailing({ class: props.ui?.linkTrailing })">
<slot :name="item.slot ? `${item.slot}-trailing` : 'item-trailing'" :item="(item as T)" :active="active" :index="index">
<UBadge
v-if="item.badge"
@@ -199,6 +199,7 @@ const lists = computed(() => props.items?.length ? (Array.isArray(props.items[0]
/>
<UIcon v-if="(orientation === 'horizontal' && (item.children?.length || !!slots[item.slot ? `${item.slot}-content` : 'item-content'])) || (orientation === 'vertical' && item.children?.length)" :name="item.trailingIcon || trailingIcon || appConfig.ui.icons.chevronDown" :class="ui.linkTrailingIcon({ class: props.ui?.linkTrailingIcon, active })" />
<UIcon v-else-if="item.trailingIcon" :name="item.trailingIcon" :class="ui.linkTrailingIcon({ class: props.ui?.linkTrailingIcon, active })" />
</slot>
</span>
</slot>