<template>
  <component
    :is="tag"
    v-on="$listeners"
    class="c-list-group__item"
    :class="{
      'c-list-group__item--active': active,
      'c-list-group__item--disabled': disabled,
      'c-list-group__item--action': actionable
    }">
    <slot></slot>
  </component>
</template>
<script>
  export default {
    name: 'el-list-group-item',
    props: {
      tag: {
        type: String,
        default: 'li'
      },
      active: {
        type: Boolean,
        default: false
      },
      disabled: {
        type: Boolean,
        default: false
      },
      actionable: {
        type: Boolean,
        default: false
      }
    }
  };
</script>
