<template>
  <select :style="component.style" class="rendered-select">
    <option v-for="(option, index) in component.options" :key="index" :value="option.value">{{ option.text }}</option>
    <option v-if="!component.options || component.options.length === 0">Default Option</option>
  </select>
</template>

<script setup>
import { defineProps } from 'vue';

const props = defineProps({
  component: Object,
});
</script>

<style scoped>
.rendered-select {
  width: 100%;
  height: 100%;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 0.5rem;
  box-sizing: border-box;
  background-color: white;
}
</style>
