Overview
Purpose: exposes the text content of a list's items as an array of strings.
This mixin works toward the beginning of the Elix render pipeline:
events → setState → render DOM → post-render
Expects the component to provide:
[internal.state].itemsstate member, often via SlotItemsMixin or the lower-level ContentItemsMixin.
Provides the component with:
[internal.state].textsstate member containing an array of text strings corresponding to the text content of the current set of items.
Usage
import ItemsTextMixin from "elix/src/base/ItemsTextMixin.js";
import SlotItemsMixin from "elix/src/base/SlotItemsMixin.js";
class MyElement extends ItemsTextMixin(SlotItemsMixin(HTMLElement)) {}
Example
ItemsTextMixin is useful for components that want to search the text content of a list's items. The related KeyboardPrefixCursorMixin can use the [internal.state].texts member created by ItemsTextMixin to let the user select an item by typing its first few characters.
API
Used by classes AutoCompleteComboBox, FilterComboBox, FilterListBox, ListBox, Menu, MultiSelectListBox, OptionList, PlainAutoCompleteComboBox, PlainFilterComboBox, PlainFilterListBox, PlainListBox, PlainMenu, PlainMultiSelectListBox, and PlainOptionList.
getitem) method
Extract the text from the given item.
The default implementation returns an item's aria-label, alt
attribute, innerText, or textContent, in that order. You can override
this to return the text that should be used.
Parameters:
- item:
Element–
Returns: string