<template>
  <select
    class="form-control"
    :value="modelValue"
    @change="onChange"
  >
    <option v-for="opt in options" :key="opt.value" :value="opt.value">
      {{ opt.label }}
    </option>
  </select>
</template>

<script setup>
import { INTERACTION_INTENSITIES } from '../domain/networkChoices'

defineProps({
  modelValue: { type: String, default: 'intense' },
  options: { type: Array, default: () => INTERACTION_INTENSITIES },
})

const emit = defineEmits(['update:modelValue'])

function onChange(e) {
  emit('update:modelValue', e.target.value)
}
</script>
