mirror of
https://github.com/immich-app/immich
synced 2025-11-07 17:27:20 +00:00
chore: migrate away from event dispatcher (#12820)
This commit is contained in:
parent
529d49471f
commit
124eb8251b
72 changed files with 360 additions and 656 deletions
|
|
@ -21,7 +21,7 @@
|
|||
import { fly } from 'svelte/transition';
|
||||
import Icon from '$lib/components/elements/icon.svelte';
|
||||
import { mdiMagnify, mdiUnfoldMoreHorizontal, mdiClose } from '@mdi/js';
|
||||
import { createEventDispatcher, tick } from 'svelte';
|
||||
import { tick } from 'svelte';
|
||||
import type { FormEventHandler } from 'svelte/elements';
|
||||
import { shortcuts } from '$lib/actions/shortcut';
|
||||
import { focusOutside } from '$lib/actions/focus-outside';
|
||||
|
|
@ -35,6 +35,7 @@
|
|||
export let options: ComboBoxOption[] = [];
|
||||
export let selectedOption: ComboBoxOption | undefined = undefined;
|
||||
export let placeholder = '';
|
||||
export let onSelect: (option: ComboBoxOption | undefined) => void = () => {};
|
||||
|
||||
/**
|
||||
* Unique identifier for the combobox.
|
||||
|
|
@ -61,10 +62,6 @@
|
|||
searchQuery = selectedOption ? selectedOption.label : '';
|
||||
}
|
||||
|
||||
const dispatch = createEventDispatcher<{
|
||||
select: ComboBoxOption | undefined;
|
||||
}>();
|
||||
|
||||
const activate = () => {
|
||||
isActive = true;
|
||||
searchQuery = '';
|
||||
|
|
@ -105,10 +102,10 @@
|
|||
optionRefs[0]?.scrollIntoView({ block: 'nearest' });
|
||||
};
|
||||
|
||||
let onSelect = (option: ComboBoxOption) => {
|
||||
let handleSelect = (option: ComboBoxOption) => {
|
||||
selectedOption = option;
|
||||
searchQuery = option.label;
|
||||
dispatch('select', option);
|
||||
onSelect(option);
|
||||
closeDropdown();
|
||||
};
|
||||
|
||||
|
|
@ -117,7 +114,7 @@
|
|||
selectedIndex = undefined;
|
||||
selectedOption = undefined;
|
||||
searchQuery = '';
|
||||
dispatch('select', selectedOption);
|
||||
onSelect(selectedOption);
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
@ -188,7 +185,7 @@
|
|||
shortcut: { key: 'Enter' },
|
||||
onShortcut: () => {
|
||||
if (selectedIndex !== undefined && filteredOptions.length > 0) {
|
||||
onSelect(filteredOptions[selectedIndex]);
|
||||
handleSelect(filteredOptions[selectedIndex]);
|
||||
}
|
||||
closeDropdown();
|
||||
},
|
||||
|
|
@ -245,7 +242,7 @@
|
|||
bind:this={optionRefs[index]}
|
||||
class="text-left w-full px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-700 transition-all cursor-pointer aria-selected:bg-gray-100 aria-selected:dark:bg-gray-700"
|
||||
id={`${listboxId}-${index}`}
|
||||
on:click={() => onSelect(option)}
|
||||
on:click={() => handleSelect(option)}
|
||||
role="option"
|
||||
>
|
||||
{option.label}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue