@siberiaweb/components/lib/dropdown-list/ItemElement.ts

Веб-компоненты.

import CSS from "./CSS";
import Item from "./Item";
import WebComponent from "@siberiaweb/webcomponent/lib/WebComponent";


/**
 * Элемент позиции выпадающего списка.
 */
export default class ItemElement extends HTMLDivElement {

    /**
     * Наименование компонента.
     */
    public static readonly COMPONENT_NAME: string = "sw-dropdown-list-item";

    /**
     * Содержание.
     */
    private readonly content: HTMLSpanElement;

    /**
     * Позиция.
     */
    private _item: Item | null = null;


    /**
     * Создание содержания.
     */
    private createContent(): HTMLSpanElement {
        let content: HTMLSpanElement = document.createElement( "span" );
        content.classList.add( CSS.ITEM_CONTENT );

        return content;
    }


    /**
     * Признак, что элемент впервые подключен подключен к DOM.
     */
    private firstConnected: boolean = false;


    /**
     * Элемент подключен к DOM.
     */
    protected connectedCallback(): void {
        if ( !this.firstConnected ) {
            this.firstConnected = true;
            this.classList.add( CSS.ITEM );
            this.appendChild( this.content );
        }
    }


    /**
     * Получение позиции.
     *
     * @throws Error Если для элемента позиции не указана позиция.
     */
    public get item(): Item {
        if ( this._item === null ) {
            throw new Error( "Для элемента позиции не указана позиция." );
        }

        return this._item;
    }


    /**
     * Установка позиции.
     *
     * @param value Значение.
     */
    public set item(
        value: Item
    ) {
        this._item = value;
    }


    /**
     * Получение содержания.
     */
    public getContent(): HTMLSpanElement {
        return this.content;
    }


    /**
     * Выбор позиции.
     */
    public select(): void {
        this.classList.add( CSS.SELECTED_ITEM );
    }


    /**
     * Отмена выбора позиции.
     */
    public unselect(): void {
        this.classList.remove( CSS.SELECTED_ITEM );
    }


    /**
     * Конструктор.
     */
    constructor() {
        super();

        this.content = this.createContent();
    }


}


WebComponent.define( ItemElement, "div" );