<template>
  <SettingsItem :label="label">
    <template #default>
      <select class="form-control" v-model="model">
        <option
          v-for="(value, key) in items"
          :value="normalizeOptionValue(key)"
          :key="key"
        >
          {{ value }}
        </option>
      </select>
    </template>
    <template #help>
      <slot/>
    </template>
  </SettingsItem>
</template>

<script setup>
import SettingsItem from "@/components/SettingsItem.vue";

const model = defineModel();
const props = defineProps({
  items: {
    type: Object,
    default: {},
  },
  label: {
    type: String,
    default: '',
  },
});

// Преобразуем числовые ключи обратно в Number, чтобы v-model не получал строки
const normalizeOptionValue = (key) => {
  if (typeof key === 'number') {
    return key;
  }

  const parsed = Number(key);
  return Number.isNaN(parsed) ? key : parsed;
};
</script>

<style scoped>

</style>
