<template>
    <div class="relative w-full max-w-md">
        <input
            v-model="query"
            type="text"
            placeholder="Search..."
            class="w-full rounded-lg border border-slate-200 bg-white px-4 py-2 text-sm text-slate-700 shadow-sm focus:border-slate-400 focus:outline-none"
        />
        <span
            class="pointer-events-none absolute right-3 top-2.5 text-xs text-slate-400"
        >
            ⌘K
        </span>
    </div>
</template>

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

const query = ref('');
</script>
