src/lib/components/models/autocomplete/Item.svelte

<script lang="ts">
	import type { ModelCard } from "$lib/type";
	
  export let model: ModelCard;
  export let onClick: () => void;

</script>

<button
  class="flex items-center justify-start gap-4 px-2 py-2.5 hover:bg-neutral-800/60 transition-all duration-200 rounded-lg cursor-pointer w-full text-left"
  on:click={onClick}
>
  <img src={model.image} alt={model.title} class="w-14 h-14 rounded-lg object-cover" />
  <div>
    <p class="text-neutral-200 text-base font-medium">{model.title}</p>
    <p class="text-neutral-400 text-sm">{model.id}</p>
  </div>
</button>