atinc / ngx-tethys / d9ae709b-3c27-4b69-b125-b8b80b54f90b

import { Component, Input, HostBinding, ElementRef, ChangeDetectorRef, Inject, HostListener, Optional } from '@angular/core';

import { Highlightable } from '@angular/cdk/a11y';

import { coerceBooleanProperty } from 'ngx-tethys/util';

import { IThyListOptionParentComponent, THY_LIST_OPTION_PARENT_COMPONENT } from '../option.token';

import { ThyIconComponent } from 'ngx-tethys/icon';

import { NgIf } from '@angular/common';

import { InputBoolean } from 'ngx-tethys/core';

export type ThyListLayout = 'list' | 'grid';

/**

 * @order 30

@Component({

    selector: 'thy-list-option,[thy-list-option]',

    standalone: true,

    imports: [NgIf, ThyIconComponent]

export class ThyListOptionComponent implements Highlightable {

    @HostBinding(`class.thy-list-option`)

        return this.parentSelectionList.layout === 'list';

    }

    @HostBinding(`class.thy-grid-option`)

    @HostBinding(`attr.tabindex`) _tabIndex = -1;

    @Input()

    @InputBoolean()

    set thyDisabled(value: boolean) {

        this.disabled = coerceBooleanProperty(value);

    }

    @HostBinding(`class.disabled`) disabled?: boolean;

    /** Whether the option is selected. */

    @HostBinding(`class.active`)

    }

        public element: ElementRef<HTMLElement>,

        private changeDetector: ChangeDetectorRef,

        /** @docs-private */

        @Optional() @Inject(THY_LIST_OPTION_PARENT_COMPONENT) public parentSelectionList: IThyListOptionParentComponent

    ) {}

    onClick(event: Event) {

            this.parentSelectionList.toggleOption(this, event);

            this.parentSelectionList.setActiveOption(this);

        }

    }

    // @HostListener('focus', ['$event'])

    // onFocus(event: Event) {

    //     this.parentSelectionList.setFocusedOption(this, event);

    // }

    /** Allows for programmatic focusing of the option. */

    // focus(origin?: FocusOrigin): void {

    //     this.element.nativeElement.focus();

    // }

    setActiveStyles(): void {

        this.element.nativeElement.classList.add('hover');

    }

    setInactiveStyles(): void {

        this.element.nativeElement.classList.remove('hover');

    /**

     * Returns the list item's text label. Implemented as a part of the FocusKeyManager.

     * @docs-private

     */

    getLabel() {

        return '';

    }

}