<template>
  <div class="input">
    <label>
      <span class="label"><slot></slot></span>
      <select v-bind:value="value"
              v-on:input="$emit('input', $event.target.value)">
        <option v-for="v in values"
                :key="v.value"
                :value="v.value">{{ v.name }}</option>
      </select>
    </label>
  </div>
</template>

<script>
export default {
  name: "text-input",
  props: ['value', 'values']
}
</script>

<style scoped>
.label {
  font-size: 80%;
}

select {
  width: 100%;
}
</style>
