Files
gift-planner/src/lib/components/molecules/SearchBar.svelte

21 lines
516 B
Svelte

<script>
import { searchStore } from '$lib/store/search.svelte';
import { Search } from 'lucide-svelte';
import { slide } from 'svelte/transition';
let showSearch = $state(false);
</script>
<div class="flex items-center gap-2">
{#if showSearch}
<input
transition:slide={{ axis: 'x' }}
bind:value={searchStore.value}
type="text"
placeholder="Szukaj"
class="border-none rounded-xl bg-neutral-300"
/>
{/if}
<Search class="cursor-pointer" onclick={() => (showSearch = !showSearch)} />
</div>