Skip to content

Commit

Permalink
enh: added option to render icon and text for breadcrumb
Browse files Browse the repository at this point in the history
Signed-off-by: Eduardo Morales <emoral435@gmail.com>
  • Loading branch information
emoral435 committed Feb 16, 2024
1 parent 58b6027 commit f5a4076
Showing 1 changed file with 13 additions and 2 deletions.
15 changes: 13 additions & 2 deletions src/components/NcBreadcrumb/NcBreadcrumb.vue
Original file line number Diff line number Diff line change
Expand Up @@ -46,12 +46,15 @@ Renders a button element when given no redirection props, otherwise, renders <a/
type="tertiary"
v-bind="linkAttributes"
v-on="$listeners">
<template v-if="$slots.icon || icon" #icon>
<template v-if="icon || $slots.icon" #icon>
<!-- @slot Slot for passing a material design icon. Precedes the icon and name prop. -->
<slot name="icon">
<span :class="icon" class="icon" />
</slot>
</template>
<template v-if="($slots.icon || icon) && forceIconText" #default>
{{ name }}
</template>
<template v-else #default>
{{ name }}
</template>
Expand Down Expand Up @@ -137,13 +140,21 @@ export default {
},

/**
* Set a css icon-class to show an icon instead of the name text.
* Set a css icon-class to show an icon along name text (if forceIconText is provided, otherwise just icon).
*/
icon: {
type: String,
default: '',
},

/**
* Enables text to accompany the icon, if the icon was provided. The text that will be displayed is the name prop.
*/
forceIconText: {
type: Boolean,
default: false,
},

/**
* Disable dropping on this breadcrumb.
*/
Expand Down

0 comments on commit f5a4076

Please sign in to comment.