UNPKG

@uimkit/uikit-react

Version:

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

161 lines (158 loc) 6.95 kB
import { __awaiter, __generator } from 'tslib'; import { useRef, useEffect, useCallback } from 'react'; import { CONSTANT_DISPATCH_TYPE } from '../../../constants.js'; import '../../../context/TranslationContext.js'; import { useUIKit } from '../../../context/UIKitContext.js'; import '../../../context/ComponentContext.js'; import { useChatActionContext } from '../../../context/ChatActionContext.js'; import '../../../context/MessageInputContext.js'; import '../../../context/UIMessageContext.js'; import '../../../context/ChatStateContext.js'; import { MessageType } from '../../../types/models.js'; import '../../../types/events.js'; import '@emoji-mart/data'; import 'emoji-mart'; import '../../../context/EmojiContext.js'; import '../../EmptyStateIndicator/EmptyStateIndicator.js'; import '../../Icon/type.js'; import '../../Icon/config.js'; import './useHandleQuoteMessage.js'; import '@emoji-mart/data/i18n/zh.json'; import '@emoji-mart/data/i18n/en.json'; import '../../Plugins/index.js'; import '../../EmoticonItem/EmoticonItem.js'; import '../../UICommandItem/UICommandItem.js'; import '../../../node_modules/.pnpm/lodash.throttle@4.1.1/node_modules/lodash.throttle/index.js'; import '../../UIUserItem/UIUserItem.js'; import '../../../node_modules/.pnpm/react-popper@2.3.0_r6q5zrenym2zg7je7hgi674bti/node_modules/react-popper/lib/esm/Manager.js'; import 'react-dom'; import '../../../node_modules/.pnpm/warning@4.0.3/node_modules/warning/warning.js'; import '../../../node_modules/.pnpm/react-dropzone@14.2.3_react@18.2.0/node_modules/react-dropzone/dist/es/index.js'; import '../../UIChatAutoComplete/UIChatAutoComplete.js'; var useMessageInputText = function (props, state, dispatch) { var focus = props.focus, sendUploadMessage = props.sendUploadMessage, additionalTextareaProps = props.additionalTextareaProps; var text = state.text; var textareaRef = useRef(); // Focus useEffect(function () { if (focus && textareaRef.current) { textareaRef.current.focus(); } }, [focus]); // Text + cursor position var newCursorPosition = useRef(); var insertText = useCallback(function (textToInsert) { var maxLength = (additionalTextareaProps || {}).maxLength; if (!textareaRef.current) { dispatch({ getNewText: function (text) { var updatedText = text + textToInsert; if (maxLength && updatedText.length > maxLength) { return updatedText.slice(0, maxLength); } return updatedText; }, type: CONSTANT_DISPATCH_TYPE.SET_TEXT, }); return; } var _a = textareaRef.current, selectionEnd = _a.selectionEnd, selectionStart = _a.selectionStart; newCursorPosition.current = selectionStart + textToInsert.length; dispatch({ getNewText: function (prevText) { var updatedText = prevText.slice(0, selectionStart) + textToInsert + prevText.slice(selectionEnd); if (maxLength && updatedText.length > maxLength) { return updatedText.slice(0, maxLength); } return updatedText; }, type: CONSTANT_DISPATCH_TYPE.SET_TEXT, }); }, [additionalTextareaProps, newCursorPosition, textareaRef]); useEffect(function () { var textareaElement = textareaRef.current; if (textareaElement && newCursorPosition.current !== undefined) { textareaElement.selectionStart = newCursorPosition.current; textareaElement.selectionEnd = newCursorPosition.current; newCursorPosition.current = undefined; } }, [text, newCursorPosition]); var client = useUIKit().client; var _a = useChatActionContext('UIMessageInput'); _a.sendMessage; _a.createTextMessage; _a.operateMessage; var handleChange = useCallback(function (event) { event.preventDefault(); if (!event || !event.target) { return; } dispatch({ type: CONSTANT_DISPATCH_TYPE.SET_TEXT, getNewText: function (text) { return event.target.value; }, }); }, [client]); /* const handleKeyDown = useCallback( (event?:React.KeyboardEvent<EventTarget>) => { if (!event?.ctrlKey && enterCodeList.indexOf(event?.code) > -1 && event.keyCode === 13) { event?.preventDefault(); handleSubmit(event); } if (event?.ctrlKey && enterCodeList.indexOf(event?.code) > -1 && event.keyCode === 13) { dispatch({ type: CONSTANT_DISPATCH_TYPE.SET_TEXT, getNewText: (text: string) => `${text}\n`, }); } }, [handleSubmit, dispatch], );*/ var handlePaste = useCallback(function (e) { return __awaiter(void 0, void 0, void 0, function () { var _a, types, items; return __generator(this, function (_b) { e.preventDefault(); if (!(e.clipboardData && e.clipboardData.items)) { return [2 /*return*/]; } _a = e.clipboardData, types = _a.types, items = _a.items; types.find(function (type, index) { var item = items[index]; switch (type) { case 'text/plain': item.getAsString(function (str) { dispatch({ type: CONSTANT_DISPATCH_TYPE.SET_TEXT, getNewText: function (text) { return "".concat(text).concat(str); }, }); }); return true; case 'Files': { var file = item.getAsFile(); if (item && item.kind === 'file' && item.type.match(/^image\//i)) { sendUploadMessage({ file: file }, MessageType.Image); } return true; } default: return false; } }); return [2 /*return*/]; }); }); }, [textareaRef]); var setText = useCallback(function (textToInsert) { var _a; dispatch({ type: CONSTANT_DISPATCH_TYPE.SET_TEXT, getNewText: function () { return "".concat(textToInsert); }, }); (_a = textareaRef === null || textareaRef === void 0 ? void 0 : textareaRef.current) === null || _a === void 0 ? void 0 : _a.focus(); }, [textareaRef]); return { textareaRef: textareaRef, handleChange: handleChange, handlePaste: handlePaste, insertText: insertText, setText: setText, }; }; export { useMessageInputText }; //# sourceMappingURL=useMessageInputText.js.map