All files / lib/components list-group-item.vue

75% Statements 18/24
75% Branches 24/32
100% Functions 9/9
75% Lines 18/24
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 8218x 18x 18x   18x 18x                     18x       18x     18x                                 18x           18x   18x             3x     3x           3x     3x     3x       3x     3x        
<template>
    <component :is="myTag"
    I           :class="classObject"
               ref="item"
           E    v-bind="conditionalLinkProps">
        <slot></slot>
    </component>
</template>
 
<script>
import bLink from './link.vue';
import { props as originalLinkProps, computed, omitLinkProps } from '../mixins/link';
import { arrayIncludes } from '../utils/array';
import { assign } from '../utils/object';
// copy link props, but exclude defaults for 'href', 'to', & 'tag'
// to ensure proper component tag computation
const linkProps = assign(omitLinkProps('href', 'to'), {
    href: { type: originalLinkProps.href.type },
    to: { type: originalLinkProps.to.type },
    tag: { type: originalLinkProps.tag.type }
});
 
const actionTags = ['a', 'router-link', 'button', 'b-link'];

export default {
    components: { bLink },
 
    computed: {
        linkProps: computed.linkProps,
 
        classObject() {
            return [
                'list-group-item',
                this.listState,
                this.active ? 'active' : null,
                this.disabled ? 'disabled' : null,
                this.isAction ? 'list-group-item-action' : null
            ];
        },
 
        isAction() {
            if (this.action === false) {
                return false;
            }
 
            // this previously could return a string,
            // coercing to a boolean for more consistent expected value
            return !!(this.action || this.to || this.href || arrayIncludes(actionTags, this.tag));
        },
 
        listState() {
            return this.variant ? `list-group-item-${this.variant}` : null;
        },
 
        myTag() {
            if (this.tag) {
                return this.tag;
            }
I
            return (this.to || this.href) ? 'b-link' : 'div';
        },
 
        conditionalLinkProps() {
            return this.myTag !== 'b-link' ? {} : this.linkProps;
        }
    },
 
    // merge the link props with list-group-item props
    props: assign(linkProps, {
        action: {
            typeI: Boolean,
            default: null
        },
 
        variant: {
            type: String,
            default: null
        },
    })
};
</script>