import QIcon from '../icon/QIcon.js'

export default {
  name: 'QTimelineEntry',
  inject: {
    __timeline: {
      default () {
        console.error('QTimelineEntry needs to be child of QTimeline')
      }
    }
  },
  props: {
    heading: Boolean,
    tag: {
      type: String,
      default: 'h3'
    },
    side: {
      type: String,
      default: 'right',
      validator: v => ['left', 'right'].includes(v)
    },
    icon: String,
    color: String,
    title: String,
    subtitle: String
  },
  computed: {
    colorClass () {
      return `text-${this.color || this.__timeline.color}`
    },
    classes () {
      return [
        `q-timeline-entry-${this.side === 'left' ? 'left' : 'right'}`,
        this.icon ? 'q-timeline-entry-with-icon' : ''
      ]
    }
  },
  render (h) {
    if (this.heading) {
      return h('div', { staticClass: 'q-timeline-heading' }, [
        h('div'),
        h('div'),
        h(
          this.tag,
          { staticClass: 'q-timeline-heading-title' },
          this.$slots.default
        )
      ])
    }

    return h('li', {
      staticClass: `q-timeline-entry`,
      'class': this.classes
    }, [
      h('div', { staticClass: 'q-timeline-subtitle' }, [
        h('span', this.subtitle)
      ]),

      h('div', {
        staticClass: 'q-timeline-dot',
        'class': this.colorClass
      }, [
        this.icon
          ? h(QIcon, {
            staticClass: 'row items-center justify-center',
            props: { name: this.icon }
          })
          : null
      ]),

      h(
        'div',
        { staticClass: 'q-timeline-content' },
        [
          h('h6', { staticClass: 'q-timeline-title' }, [ this.title ])
        ].concat(this.$slots.default)
      )
    ])
  }
}

@@ -1155,24 +1155,48 @@
   %7D, %5B%0A     
+ this.$slots.subtitle %7C%7C
  h('div', %7B 
@@ -1270,33 +1270,32 @@
 itle)%0A      %5D),%0A
-%0A
       h('div', %7B
@@ -1637,16 +1637,38 @@
 %0A       
+ (this.$slots.title %7C%7C
  %5B%0A     
@@ -1742,16 +1742,17 @@
        %5D
+)
 .concat(

Allow titles slots for Timeline Entries (#2736)