private _renderFullPicker()

in packages/roosterjs-react-emoji/lib/components/EmojiPane.tsx [225:258]
33 lines of code
4 McCabe index (conditional complexity)

    private _renderFullPicker(): JSX.Element {
        const { fullPickerClassName, searchDisabled, searchPlaceholder, searchInputAriaLabel } = this.props;
        const emojiId = this._getEmojiIconId(this.getSelectedEmoji());
        const autoCompleteAttributes = {
            [AriaAttributes.AutoComplete]: "list",
            [AriaAttributes.Expanded]: "true",
            [AriaAttributes.HasPopup]: "listbox",
            [AriaAttributes.Owns]: this._listId
        };
        if (emojiId) {
            autoCompleteAttributes[AriaAttributes.ActiveDescendant] = emojiId;
        }

        return (
            <div className={css(PaneBaseClassName, fullPickerClassName)}>
                {!searchDisabled && (
                    <TextField
                        role="combobox"
                        componentRef={this._searchRefCallback}
                        value={this.state.searchInBox}
                        onChange={this._onSearchChange}
                        inputClassName={Styles.emojiTextInput}
                        onKeyPress={this._onSearchKeyPress}
                        onKeyDown={this._onSearchKeyDown}
                        onFocus={this._onSearchFocus}
                        placeholder={searchPlaceholder}
                        ariaLabel={searchInputAriaLabel}
                        {...autoCompleteAttributes}
                    />
                )}
                {this.state.mode === EmojiPaneMode.Full ? this._renderFullList() : this._renderPartialList()}
            </div>
        );
    }