@uimkit/uikit-react/dist/esm/components/UIMessageInput/EmojiPicker.js

<img style="width:64px" src="https://mgmt.uimkit.chat/media/img/avatar.png"/>

import { __awaiter, __generator } from 'tslib';
import React__default, { useState, useEffect } from 'react';
import { useTranslationContext } from '../../context/TranslationContext.js';
import '../../context/UIKitContext.js';
import '../../context/ComponentContext.js';
import '../../context/ChatActionContext.js';
import { useMessageInputContext } from '../../context/MessageInputContext.js';
import '../../context/UIMessageContext.js';
import '../../context/ChatStateContext.js';
import { Icon } from '../Icon/Icon.js';
import { IconTypes } from '../Icon/type.js';
import { Popup } from '../Popup/index.js';
import data from '@emoji-mart/data';
import { useEmojiContext } from '../../context/EmojiContext.js';
import zh from '@emoji-mart/data/i18n/zh.json';
import en from '@emoji-mart/data/i18n/en.json';

var i18ns = {
    zh: zh,
    en: en,
};
function EmojiPicker(props) {
    var _a = useTranslationContext('EmojiPicker'); _a.t; var userLanguage = _a.userLanguage;
    var _b = useEmojiContext(), emojiConfig = _b.emojiConfig, EmojiPickerComponent = _b.EmojiPicker;
    var _c = useState(), i18n = _c[0], setI18n = _c[1];
    useEffect(function () {
        (function () {
            return __awaiter(this, void 0, void 0, function () {
                var i18n;
                return __generator(this, function (_a) {
                    i18n = i18ns[userLanguage];
                    if (i18n) {
                        setI18n(i18n);
                        console.log('设置表情 i18n: ', i18n);
                    }
                    return [2 /*return*/];
                });
            });
        })();
    }, [userLanguage]);
    var _d = useState(false), show = _d[0], setShow = _d[1];
    var _e = useState(0), index = _e[0]; _e[1];
    var _f = useState(''), className = _f[0], setClassName = _f[1];
    var handleShow = function () {
        setShow(!show);
    };
    var _g = useMessageInputContext('UIMessageInputDefault'), onSelectEmoji = _g.onSelectEmoji, sendFaceMessage = _g.sendFaceMessage;
    var handleSelectEmoji = function (emoji) {
        if (index === 0) {
            onSelectEmoji(emoji);
        }
        else {
            sendFaceMessage(emoji);
        }
        handleShow();
    };
    var handleVisible = function (data) {
        setClassName("".concat(!data.top && 'emoji-plugin-top', " ").concat(!data.left && 'emoji-plugin-right'));
    };
    var emojiData = (emojiConfig !== null && emojiConfig !== void 0 ? emojiConfig : {}).emojiData;
    if (!emojiData)
        return null;
    return (React__default.createElement("div", { className: "emoji-picker input-plugin-popup" },
        React__default.createElement(Icon, { width: 20, height: 20, type: IconTypes.EMOJI, onClick: handleShow }),
        React__default.createElement(Popup, { className: "input-plugin-popup-box ".concat(className), show: show, close: handleShow, handleVisible: handleVisible },
            React__default.createElement(EmojiPickerComponent, { i18n: i18n, data: data, onEmojiSelect: handleSelectEmoji }))));
}

export { EmojiPicker };
//# sourceMappingURL=EmojiPicker.js.map