<script setup>
    const props = defineProps({
        title:String,
        name:String,
        placeholder:String
    });
    const emits = defineEmits(['changeInput']);
    const state = ref("");
    const onChange = () => {
        emits("changeInput",state.value, props.name)
    };
</script>
<template>
    <div class="flex flex-col w-[48%] ,t-2">
        <label class="text-cyan-500 mb-q text-sm">{{ title }}</label>
        <input type="text" class="p-2 border w-100 rounded" @input="onChange" 
        v-model="state" :placeholder="placeholder"/>                
    </div>
</template>