<script setup lang="ts">
import Input from "../ui/Input.vue";
import type { FieldDefinition } from "./types";

const props = defineProps<{
  field: FieldDefinition;
  modelValue?: unknown;
  error?: string;
}>();

defineEmits<{
  "update:modelValue": [value: string];
}>();
</script>

<template>
  <Input
    type="tel"
    :id="field.name"
    :name="field.name"
    :value="props.modelValue as string"
    :readonly="field.readonly"
    @input="
      $emit('update:modelValue', ($event.target as HTMLInputElement).value)
    "
  />
</template>
