fix(web): cannot use semicolon on the search bar in asset grid page (#3334)

* fix(web): cannot use semicolon on the search bar

* fix(web): cannot use semicolon on the search bar

* remove console log

* fix: disable hotkey when search is enable

* format

* fix event listener removal
This commit is contained in:
Alex 2023-07-19 11:03:23 -05:00 committed by GitHub
parent f0302670d2
commit 9f7bf36786
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 36 additions and 6 deletions

View file

@ -3,7 +3,7 @@
import Magnify from 'svelte-material-icons/Magnify.svelte';
import Close from 'svelte-material-icons/Close.svelte';
import { goto } from '$app/navigation';
import { savedSearchTerms } from '$lib/stores/search.store';
import { isSearchEnabled, savedSearchTerms } from '$lib/stores/search.store';
import { fly } from 'svelte/transition';
export let value = '';
export let grayTheme: boolean;
@ -43,6 +43,16 @@
const clearSearchTerm = () => {
$savedSearchTerms = [];
};
const onFocusIn = () => {
showBigSearchBar = true;
$isSearchEnabled = true;
};
const onFocusOut = () => {
showBigSearchBar = false;
$isSearchEnabled = false;
};
</script>
<form
@ -52,8 +62,8 @@
action={AppRoute.SEARCH}
on:reset={() => (value = '')}
on:submit|preventDefault={() => onSearch(true)}
on:focusin={() => (showBigSearchBar = true)}
on:focusout={() => (showBigSearchBar = false)}
on:focusin={onFocusIn}
on:focusout={onFocusOut}
>
<label>
<div class="absolute inset-y-0 left-0 flex items-center pl-6">