Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 | 1x 232x 1206x 363x | /**
* Copyright (c) Siemens 2016 - 2026
* SPDX-License-Identifier: MIT
*/
import { Directive, HostListener, signal } from '@angular/core';
import { SiAutocompleteListboxDirective } from './si-autocomplete-listbox.directive';
import { SiAutocompleteOptionDirective } from './si-autocomplete-option.directive';
@Directive({
selector: 'input[siAutocomplete]',
host: {
role: 'combobox',
'aria-autocomplete': 'list',
'[attr.aria-activedescendant]': 'activeDescendant',
'[attr.aria-controls]': 'listbox()?.id()',
'[attr.aria-expanded]': '!!listbox()'
},
exportAs: 'siAutocomplete'
})
export class SiAutocompleteDirective<T> {
/** @internal */
readonly listbox = signal<SiAutocompleteListboxDirective<T> | undefined>(undefined);
protected get activeDescendant(): string {
return this.listbox()?.active?.id() ?? '';
}
@HostListener('keydown', ['$event'])
protected keydown(event: KeyboardEvent): void {
this.listbox()?.onKeydown(event);
}
get active(): SiAutocompleteOptionDirective<T> | undefined | null {
return this.listbox()?.active;
}
}
|