<template>
  <div v-on="$listeners" v-bind="$attrs" class="ui-dataset-tr">
    <div class="ui-dataset-td" :class="{ [labelClass]: !!labelClass }">
      <slot name="label">{{ label }}</slot>
    </div>
    <div class="ui-dataset-td" :class="{ [valueClass]: !!valueClass }">
      <slot name="value">{{ value }}</slot>
    </div>
  </div>
</template>

<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator'

@Component({ inheritAttrs: false })
export default class UiDatalistRow extends Vue {
  @Prop(String) label!: string
  @Prop(String) value?: string
  @Prop(String) labelClass?: string
  @Prop(String) valueClass?: string
}
</script>
