Add search functionality with SearchBar component, update YearDashboard to filter people and gifts based on search input, and enhance GiftModal and PersonModal for better state management.
This commit is contained in:
20
src/lib/components/molecules/SearchBar.svelte
Normal file
20
src/lib/components/molecules/SearchBar.svelte
Normal file
@@ -0,0 +1,20 @@
|
||||
<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>
|
||||
Reference in New Issue
Block a user