public render()

in packages/roosterjs-react-emoji/lib/components/EmojiStatusBar.tsx [16:53]


    public render() {
        const { emoji, strings, className, hasResult } = this.props;

        if (!hasResult) {
            const noResultDescription = strings["emjDNoSuggetions"];
            return (
                <div className={css(StatusBarStyles.statusBar, className)}>
                    <div style={{ display: "none" }} aria-live="polite">
                        {noResultDescription}
                    </div>
                    <div className={StatusBarStyles.statusBarNoResultDetailsContainer}>
                        <TooltipHost content={noResultDescription} overflowMode={TooltipOverflowMode.Parent}>
                            <span role="alert">{noResultDescription}</span>
                        </TooltipHost>
                    </div>
                </div>
            );
        }

        const icon = emoji ? emoji.codePoint : "";
        const description = emoji ? strings[emoji.description] : "";

        return (
            <div className={css(StatusBarStyles.statusBar, className)}>
                <i className={StatusBarStyles.statusBarIcon} role="presentation" aria-hidden="true">
                    {icon}
                </i>

                <div className={StatusBarStyles.statusBarDetailsContainer}>
                    <div className={StatusBarStyles.statusBarDetails}>
                        <TooltipHost content={description} overflowMode={TooltipOverflowMode.Parent}>
                            {description}
                        </TooltipHost>
                    </div>
                </div>
            </div>
        );
    }