<script setup lang="ts">
    const search_model = defineModel<string | number | null>('search', { default: null, required: true });
</script>

<template>
        <q-input
            v-model="search_model" 
            outlined 
            dense
            rounded
            debounce="300"
            class="right-rounded"
            :label="$t('shared.label.search')" 
            label-color="accent" 
            bg-color="white" 
            color="accent"
    >
        <template #prepend>
            <q-icon 
                name="search" 
                color="accent"
            />
        </template>
    </q-input>
</template>