arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-14 20:19:34 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(ContextMenu/DropdownMenu/NavigationMenu): add external-icon prop

Browse Source 
Resolves #2996
This commit is contained in:
Benjamin Canac
2025-02-14 15:00:06 +01:00
parent ba3ed86ae1
commit 5846c1e2ee
14 changed files with 607 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/runtime/components/NavigationMenu.vue
View File

@@ -53,6 +53,12 @@ export interface NavigationMenuProps<T> extends Pick<NavigationMenuRootProps, 'm
* @defaultValue appConfig.ui.icons.chevronDown
*/
trailingIcon?: string
/**
* The icon displayed when the item is an external link.
* Set to `false` to hide the external icon.
* @defaultValue appConfig.ui.icons.external
*/
externalIcon?: boolean | string
items?: T
color?: NavigationMenuVariants['color']
variant?: NavigationMenuVariants['variant']
@@ -161,6 +167,7 @@ import UCollapsible from './Collapsible.vue'
const props = withDefaults(defineProps<NavigationMenuProps<I>>(), {
orientation: 'horizontal',
contentOrientation: 'horizontal',
externalIcon: true,
delayDuration: 0,
unmountOnHide: true,
labelKey: 'label'
@@ -222,7 +229,7 @@ const lists = computed(() => props.items?.length ? (Array.isArray(props.items[0]
{{ get(item, props.labelKey as string) }}
</slot>
<UIcon v-if="item.target === '_blank'" :name="appConfig.ui.icons.external" :class="ui.linkLabelExternalIcon({ class: props.ui?.linkLabelExternalIcon, active })" />
<UIcon v-if="item.target === '_blank' && externalIcon !== false" :name="typeof externalIcon === 'string' ? externalIcon : appConfig.ui.icons.external" :class="ui.linkLabelExternalIcon({ class: props.ui?.linkLabelExternalIcon, active })" />
</span>
<span v-if="(!collapsed || orientation !== 'vertical') && (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 })">
@@ -281,7 +288,7 @@ const lists = computed(() => props.items?.length ? (Array.isArray(props.items[0]
<p :class="ui.childLinkLabel({ class: props.ui?.childLinkLabel, active: childActive })">
{{ get(childItem, props.labelKey as string) }}
<UIcon v-if="childItem.target === '_blank'" :name="appConfig.ui.icons.external" :class="ui.childLinkLabelExternalIcon({ class: props.ui?.childLinkLabelExternalIcon, active: childActive })" />
<UIcon v-if="childItem.target === '_blank' && externalIcon !== false" :name="typeof externalIcon === 'string' ? externalIcon : appConfig.ui.icons.external" :class="ui.childLinkLabelExternalIcon({ class: props.ui?.childLinkLabelExternalIcon, active: childActive })" />
</p>
<p v-if="childItem.description" :class="ui.childLinkDescription({ class: props.ui?.childLinkDescription, active: childActive })">
{{ childItem.description }}