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

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

import { __spreadArray } from 'tslib';
import React__default, { useRef } from 'react';
import { EmojiPicker } from './EmojiPicker.js';
import { Plugins } from '../Plugins/index.js';
import { useUploadElement } from './hooks/useUploadElement.js';
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 { useChatStateContext } from '../../context/ChatStateContext.js';
import { Icon } from '../Icon/Icon.js';
import { IconTypes } from '../Icon/type.js';
import { MessageType } from '../../types/models.js';
import '../../types/events.js';

function InputPluginsDefault() {
    var _a, _b, _c, _d, _e, _f, _g;
    var _h = useMessageInputContext('UIMessageInputDefault'), sendUploadMessage = _h.sendUploadMessage, propsPluginConfig = _h.pluginConfig;
    var UIMessageInputConfig = useChatStateContext().UIMessageInputConfig;
    var propPlugins = (propsPluginConfig === null || propsPluginConfig === void 0 ? void 0 : propsPluginConfig.plugins)
        || ((_a = UIMessageInputConfig === null || UIMessageInputConfig === void 0 ? void 0 : UIMessageInputConfig.pluginConfig) === null || _a === void 0 ? void 0 : _a.plugins) || [];
    var showNumber = (propsPluginConfig === null || propsPluginConfig === void 0 ? void 0 : propsPluginConfig.showNumber)
        || ((_b = UIMessageInputConfig === null || UIMessageInputConfig === void 0 ? void 0 : UIMessageInputConfig.pluginConfig) === null || _b === void 0 ? void 0 : _b.showNumber) || 10;
    var MoreIcon = (propsPluginConfig === null || propsPluginConfig === void 0 ? void 0 : propsPluginConfig.MoreIcon) || ((_c = UIMessageInputConfig === null || UIMessageInputConfig === void 0 ? void 0 : UIMessageInputConfig.pluginConfig) === null || _c === void 0 ? void 0 : _c.MoreIcon);
    var handlePluginBoolenParams = function (porpsVal, contextVal, defaultVal) {
        if (typeof (porpsVal) === 'boolean') {
            return porpsVal;
        }
        if (typeof (contextVal) === 'boolean') {
            return contextVal;
        }
        return defaultVal;
    };
    var isEmojiPicker = handlePluginBoolenParams(propsPluginConfig === null || propsPluginConfig === void 0 ? void 0 : propsPluginConfig.isEmojiPicker, (_d = UIMessageInputConfig === null || UIMessageInputConfig === void 0 ? void 0 : UIMessageInputConfig.pluginConfig) === null || _d === void 0 ? void 0 : _d.isEmojiPicker, true);
    var isImagePicker = handlePluginBoolenParams(propsPluginConfig === null || propsPluginConfig === void 0 ? void 0 : propsPluginConfig.isImagePicker, (_e = UIMessageInputConfig === null || UIMessageInputConfig === void 0 ? void 0 : UIMessageInputConfig.pluginConfig) === null || _e === void 0 ? void 0 : _e.isImagePicker, true);
    var isVideoPicker = handlePluginBoolenParams(propsPluginConfig === null || propsPluginConfig === void 0 ? void 0 : propsPluginConfig.isVideoPicker, (_f = UIMessageInputConfig === null || UIMessageInputConfig === void 0 ? void 0 : UIMessageInputConfig.pluginConfig) === null || _f === void 0 ? void 0 : _f.isVideoPicker, true);
    var isFilePicker = handlePluginBoolenParams(propsPluginConfig === null || propsPluginConfig === void 0 ? void 0 : propsPluginConfig.isFilePicker, (_g = UIMessageInputConfig === null || UIMessageInputConfig === void 0 ? void 0 : UIMessageInputConfig.pluginConfig) === null || _g === void 0 ? void 0 : _g.isFilePicker, true);
    var pluginsRef = useRef(null);
    useTranslationContext().t;
    var ImagePicker = isImagePicker && useUploadElement({
        children: (React__default.createElement("div", { className: "input-plugin-item" },
            React__default.createElement(Icon, { width: 20, height: 20, type: IconTypes.IMAGE }))),
        type: 'image',
        accept: 'image/*',
        onChange: function (file) {
            pluginsRef.current.closeMore();
            sendUploadMessage({ file: file }, MessageType.Image);
        },
    });
    var VideoPicker = isVideoPicker && useUploadElement({
        children: (React__default.createElement("div", { className: "input-plugin-item" },
            React__default.createElement(Icon, { width: 20, height: 20, type: IconTypes.VIDEO }))),
        type: 'video',
        accept: 'video/*',
        onChange: function (file) {
            pluginsRef.current.closeMore();
            sendUploadMessage({ file: file }, MessageType.Video);
        },
    });
    var FilePicker = isFilePicker && useUploadElement({
        children: (React__default.createElement("div", { className: "input-plugin-item" },
            React__default.createElement(Icon, { width: 20, height: 20, type: IconTypes.DOCUMENT }))),
        type: 'file',
        accept: 'file/*',
        onChange: function (file) {
            pluginsRef.current.closeMore();
            sendUploadMessage({ file: file }, MessageType.File);
        },
    });
    var plugins = __spreadArray([
        isEmojiPicker && React__default.createElement(EmojiPicker, null), ImagePicker, VideoPicker, FilePicker
    ], propPlugins, true).filter(function (item) { return item; });
    return React__default.createElement(Plugins, { ref: pluginsRef, plugins: plugins, showNumber: showNumber, MoreIcon: MoreIcon });
}

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