private _getCallout()

in packages/roosterjs-react-emoji/lib/plugins/EmojiPlugin.tsx [332:366]


    private _getCallout(): JSX.Element {
        const { calloutClassName, emojiPaneProps = {} } = this.options;

        const cursorRect = this._editor.getCursorRect();
        const point = {
            x: cursorRect.left,
            y: (cursorRect.top + cursorRect.bottom) / 2
        };
        const gap = (cursorRect.bottom - cursorRect.top) / 2 + 5;

        return (
            <Callout
                className={calloutClassName}
                target={point}
                directionalHint={DirectionalHint.bottomAutoEdge}
                isBeakVisible={false}
                gapSpace={gap}
                onDismiss={this._calloutOnDismissInternal}
                ref={this._calloutRef}
            >
                <EmojiPane
                    {...emojiPaneProps}
                    ref={this._paneRef}
                    onSelect={this._onSelectFromPane}
                    strings={this._strings || {}}
                    onLayoutChanged={this._refreshCalloutDebounced}
                    onModeChanged={this._onModeChanged}
                    navBarProps={emojiPaneProps.navBarProps}
                    statusBarProps={emojiPaneProps.statusBarProps}
                    searchDisabled={!this._strings || emojiPaneProps.searchDisabled}
                    hideStatusBar={!this._strings}
                />
            </Callout>
        );
    }