import { ChangeDetectionStrategy , Component , ElementRef , EventEmitter , HostListener , Input , OnDestroy , Output , Renderer2 } from '@angular/core' ; import { FocusIndicatorOrigin , FocusIndicatorOriginService } from '../../../directives/accessibility/index' ; import { HierarchyBarService } from '../hierarchy-bar.service' ; import { HierarchyBarNode } from '../interfaces/hierarchy-bar-node.interface' ; @ Component ( { selector : 'ux-hierarchy-bar-popover-item' , templateUrl : './hierarchy-bar-popover-item.component.html' , changeDetection : ChangeDetectionStrategy . OnPush } ) export class HierarchyBarPopoverItemComponent implements OnDestroy { /** Specify the node to display */ @ Input ( ) node : HierarchyBarNode ; /**
     * Emit when a click or enter key press occurs.
     * Note this is an `async` EventEmitter to ensure that
     * the event handlers in the `FocusIndicatorOrigin` set
     * the origin before we emit the select event, otherwise
     * the item may not get a focus ring when the keyboard is used.
     */ @ Output ( ) selected = new EventEmitter < HierarchyBarNode > ( true ) ; /** Allow this to control the focus origin */ private _focusOrigin : FocusIndicatorOrigin ; constructor ( focusOriginService , elementRef , renderer , public readonly hierarchyBar ) { this . _focusOrigin = new FocusIndicatorOrigin ( focusOriginService , elementRef , renderer ) ; } ngOnDestroy ( ) { this . _focusOrigin . destroy ( ) ; } @ HostListener ( 'click' ) @ HostListener ( 'keydown.enter' ) onSelect ( ) { this . selected . emit ( this . node ) ; } }