- toState<T>(config, model): {
allItems: T[];
aria: {
helperText: {
id: string;
};
input: {
aria-activedescendant?: string;
aria-autocomplete: "list";
aria-controls: string;
aria-describedby: string;
aria-expanded: "true" | "false";
aria-haspopup: "listbox";
autocomplete: "off";
combobox: "off";
id: string;
role: "combobox";
spellcheck: "false";
tabindex: 0;
};
inputLabel: {
for: string;
htmlFor: string;
id: string;
};
item: ((item) => {
aria-disabled: false;
aria-selected: boolean;
id: string;
role: "option";
});
itemList: {
aria-labelledby: string;
aria-multiselectable: boolean;
id: string;
role: "listbox";
tabindex: -1;
};
selectedItem: ((item) => {
id: string;
role: string;
tabindex: number;
});
selectedList: {
aria-activedescendant?: string;
aria-label: string;
id: string;
role: string;
};
unselectButton: ((_item) => {
aria-hidden: "true";
aria-label: "Unselect";
role: "button";
tabindex: -1;
});
};
highlightedItem: null | T;
inputValue: string;
isBlurred: boolean;
isFocused: boolean;
isItemHighlighted: ((item) => boolean);
isItemIndexHighlighted: ((index) => boolean);
isItemSelected: ((item) => boolean);
isOpened: boolean;
isSelectedItemFocused: ((selectedItem) => boolean);
itemStatus: ((item) => ItemStatus);
renderItems: RenderItem<T>[];
renderSelectedItems: RenderSelectedItem<T>[];
selectedItem: null | T;
selectedItemDirection: null | SelectedItemListDirection;
selectedItems: T[];
}
-
Returns {
allItems: T[];
aria: {
helperText: {
id: string;
};
input: {
aria-activedescendant?: string;
aria-autocomplete: "list";
aria-controls: string;
aria-describedby: string;
aria-expanded: "true" | "false";
aria-haspopup: "listbox";
autocomplete: "off";
combobox: "off";
id: string;
role: "combobox";
spellcheck: "false";
tabindex: 0;
};
inputLabel: {
for: string;
htmlFor: string;
id: string;
};
item: ((item) => {
aria-disabled: false;
aria-selected: boolean;
id: string;
role: "option";
});
itemList: {
aria-labelledby: string;
aria-multiselectable: boolean;
id: string;
role: "listbox";
tabindex: -1;
};
selectedItem: ((item) => {
id: string;
role: string;
tabindex: number;
});
selectedList: {
aria-activedescendant?: string;
aria-label: string;
id: string;
role: string;
};
unselectButton: ((_item) => {
aria-hidden: "true";
aria-label: "Unselect";
role: "button";
tabindex: -1;
});
};
highlightedItem: null | T;
inputValue: string;
isBlurred: boolean;
isFocused: boolean;
isItemHighlighted: ((item) => boolean);
isItemIndexHighlighted: ((index) => boolean);
isItemSelected: ((item) => boolean);
isOpened: boolean;
isSelectedItemFocused: ((selectedItem) => boolean);
itemStatus: ((item) => ItemStatus);
renderItems: RenderItem<T>[];
renderSelectedItems: RenderSelectedItem<T>[];
selectedItem: null | T;
selectedItemDirection: null | SelectedItemListDirection;
selectedItems: T[];
}
-
Readonly
allItems: T[]
-
Readonly
aria: {
helperText: {
id: string;
};
input: {
aria-activedescendant?: string;
aria-autocomplete: "list";
aria-controls: string;
aria-describedby: string;
aria-expanded: "true" | "false";
aria-haspopup: "listbox";
autocomplete: "off";
combobox: "off";
id: string;
role: "combobox";
spellcheck: "false";
tabindex: 0;
};
inputLabel: {
for: string;
htmlFor: string;
id: string;
};
item: ((item) => {
aria-disabled: false;
aria-selected: boolean;
id: string;
role: "option";
});
itemList: {
aria-labelledby: string;
aria-multiselectable: boolean;
id: string;
role: "listbox";
tabindex: -1;
};
selectedItem: ((item) => {
id: string;
role: string;
tabindex: number;
});
selectedList: {
aria-activedescendant?: string;
aria-label: string;
id: string;
role: string;
};
unselectButton: ((_item) => {
aria-hidden: "true";
aria-label: "Unselect";
role: "button";
tabindex: -1;
});
}
-
helperText: {
id: string;
}
-
input: {
aria-activedescendant?: string;
aria-autocomplete: "list";
aria-controls: string;
aria-describedby: string;
aria-expanded: "true" | "false";
aria-haspopup: "listbox";
autocomplete: "off";
combobox: "off";
id: string;
role: "combobox";
spellcheck: "false";
tabindex: 0;
}
-
Optional
Readonly
aria-activedescendant?: string
-
Readonly
aria-autocomplete: "list"
-
Readonly
aria-controls: string
-
Readonly
aria-describedby: string
-
Readonly
aria-expanded: "true" | "false"
-
Readonly
aria-haspopup: "listbox"
-
Readonly
autocomplete: "off"
-
Readonly
combobox: "off"
-
Readonly
id: string
-
Readonly
role: "combobox"
-
Readonly
spellcheck: "false"
-
Readonly
tabindex: 0
-
inputLabel: {
for: string;
htmlFor: string;
id: string;
}
-
for: string
-
htmlFor: string
-
id: string
-
item: ((item) => {
aria-disabled: false;
aria-selected: boolean;
id: string;
role: "option";
})
-
- (item): {
aria-disabled: false;
aria-selected: boolean;
id: string;
role: "option";
}
-
Returns {
aria-disabled: false;
aria-selected: boolean;
id: string;
role: "option";
}
-
Readonly
aria-disabled: false
-
Readonly
aria-selected: boolean
-
Readonly
id: string
-
Readonly
role: "option"
-
itemList: {
aria-labelledby: string;
aria-multiselectable: boolean;
id: string;
role: "listbox";
tabindex: -1;
}
-
Readonly
aria-labelledby: string
-
Readonly
aria-multiselectable: boolean
-
Readonly
id: string
-
Readonly
role: "listbox"
-
Readonly
tabindex: -1
-
selectedItem: ((item) => {
id: string;
role: string;
tabindex: number;
})
-
- (item): {
id: string;
role: string;
tabindex: number;
}
-
Returns {
id: string;
role: string;
tabindex: number;
}
-
id: string
-
role: string
-
tabindex: number
-
selectedList: {
aria-activedescendant?: string;
aria-label: string;
id: string;
role: string;
}
-
Optional
aria-activedescendant?: string
-
aria-label: string
-
id: string
-
role: string
-
unselectButton: ((_item) => {
aria-hidden: "true";
aria-label: "Unselect";
role: "button";
tabindex: -1;
})
-
- (_item): {
aria-hidden: "true";
aria-label: "Unselect";
role: "button";
tabindex: -1;
}
-
Returns {
aria-hidden: "true";
aria-label: "Unselect";
role: "button";
tabindex: -1;
}
-
Readonly
aria-hidden: "true"
-
Readonly
aria-label: "Unselect"
-
Readonly
role: "button"
-
Readonly
tabindex: -1
-
Readonly
highlightedItem: null | T
-
Readonly
inputValue: string
-
Readonly
isBlurred: boolean
-
Readonly
isFocused: boolean
-
Readonly
isItemHighlighted: ((item) => boolean)
-
- (item): boolean
-
Returns boolean
-
Readonly
isItemIndexHighlighted: ((index) => boolean)
-
- (index): boolean
-
Returns boolean
-
Readonly
isItemSelected: ((item) => boolean)
-
- (item): boolean
-
Returns boolean
-
Readonly
isOpened: boolean
-
Readonly
isSelectedItemFocused: ((selectedItem) => boolean)
-
- (selectedItem): boolean
-
Returns boolean
-
Readonly
itemStatus: ((item) => ItemStatus)
-
Readonly
renderItems: RenderItem<T>[]
-
Readonly
renderSelectedItems: RenderSelectedItem<T>[]
-
Readonly
selectedItem: null | T
-
-
Readonly
selectedItems: T[]