@material/list

property listElements

readonly listElements: Element[];

property selectedIndex

selectedIndex: MDCListIndex;

property typeaheadInProgress

readonly typeaheadInProgress: boolean;

• Whether typeahead is currently matching a user-specified prefix.

method attachTo

static attachTo: (root: Element) => MDCList;

method destroy

destroy: () => void;

method getDefaultFoundation

getDefaultFoundation: () => MDCListFoundation;

method getPrimaryText

getPrimaryText: (item: Element) => string;

• Extracts the primary text from a list item.

  Parameter item

  The list item element. The primary text in the element.

method initializeListType

initializeListType: () => void;

• Initialize selectedIndex value based on pre-selected list items.

method initialSyncWithDOM

initialSyncWithDOM: () => void;

method layout

layout: () => void;

method setEnabled

setEnabled: (itemIndex: number, isEnabled: boolean) => void;

• Updates the list item at itemIndex to the desired isEnabled state.

  Parameter itemIndex

  Index of the list item

  Parameter isEnabled

  Sets the list item to enabled or disabled.

method typeaheadMatchItem

typeaheadMatchItem: (nextChar: string, startingIndex?: number) => number;

• 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.

  Parameter nextChar

  The next character to add to the prefix buffer.

  Parameter startingIndex

  The index from which to start matching. Defaults to the currently focused index. The index of the matched item.

constructor

constructor(adapter?: Partial<MDCListAdapter>);

property cssClasses

static readonly 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;
};

property defaultAdapter

static readonly defaultAdapter: MDCListAdapter;

property numbers

static readonly numbers: {
    UNSET_INDEX: number;
    TYPEAHEAD_BUFFER_CLEAR_TIMEOUT_MS: number;
};

property strings

static readonly strings: {
    ACTION_EVENT: string;
    SELECTION_CHANGE_EVENT: string;
    ARIA_CHECKED: string;
    ARIA_CHECKED_CHECKBOX_SELECTOR: string;
    ARIA_CHECKED_RADIO_SELECTOR: string;
    ARIA_CURRENT: string;
    ARIA_DISABLED: string;
    ARIA_ORIENTATION: string;
    ARIA_ORIENTATION_HORIZONTAL: string;
    ARIA_ROLE_CHECKBOX_SELECTOR: string;
    ARIA_SELECTED: string;
    ARIA_INTERACTIVE_ROLES_SELECTOR: string;
    ARIA_MULTI_SELECTABLE_SELECTOR: string;
    CHECKBOX_RADIO_SELECTOR: string;
    CHECKBOX_SELECTOR: string;
    CHILD_ELEMENTS_TO_TOGGLE_TABINDEX: string;
    DEPRECATED_SELECTOR: string;
    FOCUSABLE_CHILD_ELEMENTS: string;
    RADIO_SELECTOR: string;
    SELECTED_ITEM_SELECTOR: string;
};

method clearTypeaheadBuffer

clearTypeaheadBuffer: () => void;

• Clears the typeahead buffer.

method focusFirstElement

focusFirstElement: () => number;

method focusInitialElement

focusInitialElement: () => number;

method focusLastElement

focusLastElement: () => number;

method focusNextElement

focusNextElement: (index: number) => number;

• Focuses the next element on the list.

method focusPrevElement

focusPrevElement: (index: number) => number;

• Focuses the previous element on the list.

method getFocusedItemIndex

getFocusedItemIndex: () => number;

• Returns the index of the item that was last focused.

method getSelectedIndex

getSelectedIndex: () => MDCListIndex;

method handleClick

handleClick: (
    index: number,
    isCheckboxAlreadyUpdatedInAdapter: boolean,
    event?: MouseEvent
) => void;

• Click handler for the list.

  Parameter index

  Index for the item that has been clicked.

  Parameter isCheckboxAlreadyUpdatedInAdapter

  Whether the checkbox for the list item has already been updated in the adapter. This attribute should be set to true when e.g. the click event directly landed on the underlying native checkbox element which would cause the checked state to be already toggled within adapter.isCheckboxCheckedAtIndex.

method handleFocusIn

handleFocusIn: (listItemIndex: number) => void;

• Focus in handler for the list items.

method handleFocusOut

handleFocusOut: (listItemIndex: number) => void;

• Focus out handler for the list items.

method handleKeydown

handleKeydown: (
    event: KeyboardEvent,
    isRootListItem: boolean,
    listItemIndex: number
) => void;

• Key handler for the list.

method isTypeaheadInProgress

isTypeaheadInProgress: () => boolean;

• Whether typeahead is currently matching a user-specified prefix.

method layout

layout: () => void;

method setDisabledItemsFocusable

setDisabledItemsFocusable: (value: boolean) => void;

method setEnabled

setEnabled: (itemIndex: number, isEnabled: boolean) => void;

• Parameter itemIndex

  Index of the list item

  Parameter isEnabled

  Sets the list item to enabled or disabled.

method setHasTypeahead

setHasTypeahead: (hasTypeahead: boolean) => void;

• Sets whether typeahead is enabled on the list.

  Parameter hasTypeahead

  Whether typeahead is enabled.

method setSelectedIndex

setSelectedIndex: (
    index: MDCListIndex,
    options?: SelectionUpdateOptions
) => void;

method setSingleSelection

setSingleSelection: (value: boolean) => void;

• Toggles single-selection behavior.

method setUseActivatedClass

setUseActivatedClass: (useActivated: boolean) => void;

• Toggle use of the "activated" CSS class.

method setUseSelectedAttribute

setUseSelectedAttribute: (useSelected: boolean) => void;

• Toggles use of the selected attribute (true for aria-selected, false for aria-checked).

method setVerticalOrientation

setVerticalOrientation: (value: boolean) => void;

• Toggles orientation direction for keyboard navigation (true for vertical, false for horizontal).

method setWrapFocus

setWrapFocus: (value: boolean) => void;

• Toggles focus wrapping with keyboard navigation.

method typeaheadMatchItem

typeaheadMatchItem: (
    nextChar: string,
    startingIndex?: number,
    skipFocus?: boolean
) => number;

• 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.

  Parameter nextChar

  The next character to add to the prefix buffer.

  Parameter startingIndex

  The index from which to start matching. Only relevant when starting a new match sequence. To start a new match sequence, clear the buffer using clearTypeaheadBuffer, or wait for the buffer to clear after a set interval defined in list foundation. Defaults to the currently focused index. The index of the matched item, or -1 if no match.

property detail

detail: MDCListActionEventDetail;

property index

index: number;

• Index of the list item that was activated.

method addClassForElementIndex

addClassForElementIndex: (index: number, className: string) => void;

method focusItemAtIndex

focusItemAtIndex: (index: number) => void;

• Focuses list item at the index specified.

method getAttributeForElementIndex

getAttributeForElementIndex: (index: number, attr: string) => string | null;

• Returns the attribute value of list item at given index.

method getFocusedElementIndex

getFocusedElementIndex: () => number;

method getListItemCount

getListItemCount: () => number;

method getPrimaryTextAtIndex

getPrimaryTextAtIndex: (index: number) => string;

• the primary text content of the list item at index.

method hasCheckboxAtIndex

hasCheckboxAtIndex: (index: number) => boolean;

• true if checkbox is present at given list item index.

method hasRadioAtIndex

hasRadioAtIndex: (index: number) => boolean;

• true if radio button is present at given list item index.

method isCheckboxCheckedAtIndex

isCheckboxCheckedAtIndex: (index: number) => boolean;

• true if checkbox inside a list item is checked.

method isFocusInsideList

isFocusInsideList: () => boolean;

• true when the current focused element is inside list root.

method isRootFocused

isRootFocused: () => boolean;

• true if root element is focused.

method listItemAtIndexHasClass

listItemAtIndexHasClass: (index: number, className: string) => boolean;

• Parameter index

  list item index.

  Parameter className

  the name of the class whose presence is to be checked. true if list item at index has class className.

method notifyAction

notifyAction: (index: number) => void;

• Notifies user action on list item.

method notifySelectionChange

notifySelectionChange: (changedIndices: number[]) => void;

• Notifies that items at the given indices have changed its selection state through user interaction (e.g. click).

  This is invoked only for changes caused by user interaction to match with the native change event semantics.

method removeClassForElementIndex

removeClassForElementIndex: (index: number, className: string) => void;

method setAttributeForElementIndex

setAttributeForElementIndex: (
    index: number,
    attribute: string,
    value: string
) => void;

method setCheckedCheckboxOrRadioAtIndex

setCheckedCheckboxOrRadioAtIndex: (index: number, isChecked: boolean) => void;

• Sets the checked status of checkbox or radio at given list item index.

method setTabIndexForListItemChildren

setTabIndexForListItemChildren: (
    listItemIndex: number,
    tabIndexValue: string
) => void;

• Sets the tabindex to the value specified for all button/a element children of the list item at the index specified.

property changedIndices

changedIndices: number[];

• Indices of the list items for which the selection changed.

property detail

detail: MDCListSelectionChangeDetail;

property index

index: number;

property text

text: string;