@sendbird/uikit-react/OpenChannel/components/OpenChannelInput.js

Sendbird UIKit for React: A feature-rich and customizable chat UI kit with messaging, channel management, and user authentication.

import React__default, { useContext, useEffect, useRef, useCallback } from 'react';
import { L as LocalizationContext } from '../../chunks/bundle-Cdqsdoa8.js';
import { c as checkIfFileUploadEnabled, M as MessageInput } from '../../chunks/bundle-BCjR1Qiq.js';
import { a as usePendingFiles, u as useDragAndDrop } from '../../chunks/bundle-ExNQo0Ly.js';
import { u as useMediaQueryContext } from '../../chunks/bundle-C2ARCMSL.js';
import { u as useOpenChannelContext } from '../../chunks/bundle-Dj_wODPB.js';
import { useGlobalModalContext } from '../../hooks/useModal.js';
import { u as useSendbird } from '../../chunks/bundle-4clodtJA.js';
import '../../chunks/bundle-Bpofr334.js';
import '../../chunks/bundle-oM0Fxt9G.js';
import '../../chunks/bundle-DmnXeBdU.js';
import '../../chunks/bundle-BEPoP7sp.js';
import '../../chunks/bundle-CFc2hy8g.js';
import '../../ui/IconButton.js';
import '../../ui/Button.js';
import '../../chunks/bundle-Cdplrrlw.js';
import '../../chunks/bundle-C5-D2BAP.js';
import 'dompurify';
import '../../chunks/bundle-6I0gJidJ.js';
import '../../chunks/bundle-B40pTdZv.js';
import '../../chunks/bundle-iPLJ9a5J.js';
import '../../ui/Icon.js';
import '../../chunks/bundle-DX6fRIJl.js';
import '../../chunks/bundle-BZSLsKkw.js';
import '@sendbird/chat/groupChannel';
import '../../utils/message/getOutgoingMessageState.js';
import '../../chunks/bundle-CglqREVl.js';
import '../../chunks/bundle-lqEjT2ED.js';
import '../../chunks/bundle-BqKoZDqX.js';
import '../../chunks/bundle-JhKiWlXT.js';
import '../../chunks/bundle-EKFQIahk.js';
import '../../chunks/bundle-LLA95Pqf.js';
import '../../chunks/bundle-B5xkbY4c.js';
import '../../chunks/bundle-C4anRHWY.js';
import 'react-dom';
import '../../chunks/bundle-B5LKcMN_.js';
import '../../chunks/bundle-DpOgiF9r.js';
import '../../chunks/bundle-YDriVB8K.js';
import '@sendbird/chat';
import '@sendbird/chat/openChannel';
import '../../chunks/bundle-BfgSx7DM.js';
import '../../chunks/bundle-F_R9C4cW.js';
import '../../chunks/bundle-B56O1y8C.js';

var OpenChannelInput = React__default.forwardRef(function (props, ref) {
    var _a = useOpenChannelContext(), currentOpenChannel = _a.currentOpenChannel, disabled = _a.disabled, handleSendMessage = _a.handleSendMessage, handleFileUpload = _a.handleFileUpload, amIMuted = _a.amIMuted;
    var channel = currentOpenChannel;
    var stringSet = useContext(LocalizationContext).stringSet;
    var openModal = useGlobalModalContext().openModal;
    var config = useSendbird().state.config;
    var uikitUploadSizeLimit = config.uikitUploadSizeLimit, logger = config.logger;
    var isMobile = useMediaQueryContext().isMobile;
    var value = props.value;
    var _b = usePendingFiles({
        uikitUploadSizeLimit: uikitUploadSizeLimit,
        uikitMultipleFilesMessageLimit: 1,
        openModal: openModal,
        stringSet: stringSet,
        logger: logger,
    }), pendingFiles = _b.pendingFiles, addFiles = _b.addFiles, removeFile = _b.removeFile, clearPendingFiles = _b.clear;
    var isFileUploadEnabled = checkIfFileUploadEnabled({ channel: currentOpenChannel !== null && currentOpenChannel !== void 0 ? currentOpenChannel : undefined, config: config });
    useDragAndDrop({
        onAddFiles: addFiles,
        disabled: isMobile || disabled || !isFileUploadEnabled,
    });
    useEffect(function () {
        clearPendingFiles();
    }, [currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.url]);
    // OpenChannel does not support MultipleFilesMessage. Files send sequentially
    // via FileMessage and the composer's text body is suppressed when files are
    // present (matches GroupChannel/Thread behavior). handleSendMessage reads the
    // textarea ref directly, so text-only sends still land on UserMessage as
    // before.
    var isSubmittingFilesRef = useRef(false);
    var handleSubmit = useCallback(function (_a) {
        var message = _a.message, files = _a.files;
        var trimmed = message.trim();
        if (files.length === 0) {
            if (trimmed.length === 0)
                return;
            handleSendMessage();
            return;
        }
        if (isSubmittingFilesRef.current)
            return;
        isSubmittingFilesRef.current = true;
        clearPendingFiles();
        try {
            handleFileUpload(files.map(function (entry) { return entry.file; }));
        }
        finally {
            isSubmittingFilesRef.current = false;
        }
    }, [handleSendMessage, handleFileUpload, clearPendingFiles]);
    function getPlaceHolderString() {
        if (amIMuted) {
            return stringSet.MESSAGE_INPUT__PLACE_HOLDER__MUTED;
        }
        if (disabled) {
            return stringSet.MESSAGE_INPUT__PLACE_HOLDER__DISABLED;
        }
        return '';
    }
    if (!channel) {
        return null;
    }
    return (React__default.createElement("div", { className: "sendbird-openchannel-footer" },
        React__default.createElement(MessageInput, { channel: currentOpenChannel, channelUrl: currentOpenChannel === null || currentOpenChannel === void 0 ? void 0 : currentOpenChannel.url, ref: ref, value: value, disabled: disabled, isVoiceMessageEnabled: false, pendingFiles: pendingFiles, onAddFiles: addFiles, onRemoveFile: removeFile, onSubmit: handleSubmit, placeholder: getPlaceHolderString() })));
});

export { OpenChannelInput as default };
//# sourceMappingURL=OpenChannelInput.js.map