@aurelia-mdc-web/list/dist/types/mdc-list.d.ts

Wrapper for Material Components Web List

import { MdcComponent } from '@aurelia-mdc-web/base';
import { MDCListFoundation, MDCListIndex } from '@material/list';
import { MdcListItem } from './mdc-list-item/mdc-list-item';
export declare const mdcListStrings: {
    ITEMS_CHANGED: string;
};
/**
 * @selector mdc-list
 * @emits mdclist:action | Indicates that a list item with the specified index has been activated
 * @emits mdclist:itemschanged | Indicates that the list of items has changed
 */
export declare class MdcList extends MdcComponent<MDCListFoundation> {
    cssClasses: {
        LIST_ITEM_ACTIVATED_CLASS: string;
        LIST_ITEM_CLASS: string;
        LIST_ITEM_DISABLED_CLASS: string;
        LIST_ITEM_SELECTED_CLASS: string;
        LIST_ITEM_TEXT_CLASS: string;
        LIST_ITEM_PRIMARY_TEXT_CLASS: string;
        ROOT: string;
    };
    /** When enabled, the space and enter keys (or click event) will trigger an single list item to become selected and any other previous selected element to become deselected */
    singleSelection: boolean;
    singleSelectionChanged(): Promise<void>;
    /** Sets the selection logic to apply/remove the mdc-list-item--activated class */
    activated: boolean;
    activatedChanged(): Promise<void>;
    items: MdcListItem[];
    itemsChanged(): void;
    typeahead: boolean;
    typeaheadChanged(hasTypeahead: boolean): Promise<void>;
    /** Sets the list to allow the up arrow on the first element to focus the last element of the list and vice versa */
    wrapFocus: boolean;
    wrapFocusChanged(): Promise<void>;
    initialSyncWithDOM(): void;
    get listElements(): Element[];
    /**
     * Extracts the primary text from a list item.
     * @param item The list item element.
     * @return The primary text in the element.
     */
    getPrimaryText(item: Element): string;
    getDefaultFoundation(): MDCListFoundation;
    /**
     * @hidden
     * Used to figure out which list item this event is targetting. Or returns -1 if
     * there is no list item
     */
    private getListItemIndex_;
    /**
     * @hidden
     * Used to figure out which element was clicked before sending the event to the foundation.
     */
    handleFocusInEvent_(evt: FocusEvent): void;
    /**
     * @hidden
     * Used to figure out which element was clicked before sending the event to the foundation.
     */
    handleFocusOutEvent_(evt: FocusEvent): void;
    /**
     * @hidden
     * Used to figure out which element was focused when keydown event occurred before sending the event to the
     * foundation.
     */
    handleKeydownEvent_(evt: KeyboardEvent): boolean;
    /**
     * @hidden
     * Used to figure out which element was clicked before sending the event to the foundation.
     */
    handleClickEvent_(evt: MouseEvent): boolean;
    /**
     * @hidden
     * @return Whether typeahead is currently matching a user-specified prefix.
     */
    get typeaheadInProgress(): boolean;
    /**
     * @hidden
     * Given the next desired character from the user, adds it to the typeahead
     * buffer. Then, attempts to find the next option matching the buffer. Wraps
     * around if at the end of options.
     *
     * @param nextChar The next character to add to the prefix buffer.
     * @param startingIndex The index from which to start matching. Defaults to
     *     the currently focused index.
     * @return The index of the matched item.
     */
    typeaheadMatchItem(nextChar: string, startingIndex?: number): number;
    layout(): void;
    get selectedIndex(): MDCListIndex;
    set selectedIndex(index: MDCListIndex);
    /**
     * @hidden
     * Initialize selectedIndex value based on pre-selected checkbox list items, single selection or radio.
     */
    initializeListType(): void;
}
/** @hidden */
export interface IMdcListElement extends HTMLElement {
    au: {
        controller: {
            viewModel: MdcList;
        };
    };
}