<script>
import SelectInput from "~/components/atoms/input/SelectInput";

export default {
  components: {
    SelectInput
  },
  props: {
    label: {type: String},
    value: {default: {}},
    options: {type: Array},
    placeholder: {default: ""},
    search_by: {default: "text"},
    is_searchable: {default: false},
    additional_class_label: {default: ""},
    additional_class_group: {default: ""},
    additional_class_input: {default: ""}
  },
  computed: {
    local_value: {
      get: function () {
        return this.value
      },
      set: function (value) {
        this.$emit('input', value)
      }
    },
  }
}
</script>
<template>
  <div :class="`row ${additional_class_group}`">
    <div :class="`col-2 px-0 pt-2 ${additional_class_label}`">
      {{ label }} :
    </div>
    <div :class="`col-9 ${additional_class_input}`">
      <select-input :options="options" v-model="local_value" :placeholder="placeholder" :search_by="search_by" :is_searchable="is_searchable"/>
    </div>
  </div>
</template>