communication-react-19
Version:
React library for building modern communication user experiences utilizing Azure Communication Services (React 19 compatible fork)
57 lines • 3.19 kB
JavaScript
// Copyright (c) Microsoft Corporation.
// Licensed under the MIT License.
import React, { useMemo } from 'react';
import { SendBox } from "../../../../react-components/src";
import { usePropsFor } from '../ChatComposite/hooks/usePropsFor';
/* @conditional-compile-remove(rich-text-editor-composite-support) */
import { Suspense } from 'react';
/* @conditional-compile-remove(rich-text-editor-composite-support) */
import { _ErrorBoundary } from "../../../../react-components/src";
/* @conditional-compile-remove(rich-text-editor-composite-support) */
/**
* Wrapper for RichTextSendBox component to allow us to use usePropsFor with richTextSendBox with lazy loading
*/
const RichTextSendBoxWrapper = React.lazy(() => import('./RichTextSendBoxWrapper').then((module) => ({ default: module.RichTextSendBoxWrapper })));
/**
* @private
* Use this function to load RoosterJS dependencies early in the lifecycle.
* It should be the same import as used for lazy loading.
*
/* @conditional-compile-remove(rich-text-editor-composite-support)
*/
export const loadRichTextSendBox = () => import('./RichTextSendBoxWrapper').then((module) => ({ default: module.RichTextSendBoxWrapper }));
/**
* @private
*/
export const SendBoxPicker = (props) => {
/* @conditional-compile-remove(rich-text-editor-composite-support) */
const { richTextEditorOptions } = props;
/* @conditional-compile-remove(rich-text-editor-image-upload) */
const { onPaste, onInsertInlineImage, inlineImagesWithProgress, onRemoveInlineImage } = richTextEditorOptions || {};
/* @conditional-compile-remove(rich-text-editor-composite-support) */
const isRichTextEditorEnabled = useMemo(() => {
return richTextEditorOptions !== undefined;
}, [richTextEditorOptions]);
const sendBox = useMemo(() => React.createElement(SendBoxWrapper, Object.assign({}, props)), [props]);
/* @conditional-compile-remove(rich-text-editor-composite-support) */
if (isRichTextEditorEnabled) {
return (React.createElement(_ErrorBoundary, { fallback: sendBox },
React.createElement(Suspense, { fallback: sendBox },
React.createElement(RichTextSendBoxWrapper, Object.assign({}, props, {
/* @conditional-compile-remove(rich-text-editor-image-upload) */
onPaste: onPaste,
/* @conditional-compile-remove(rich-text-editor-image-upload) */
onInsertInlineImage: onInsertInlineImage,
/* @conditional-compile-remove(rich-text-editor-image-upload) */
inlineImagesWithProgress: inlineImagesWithProgress,
/* @conditional-compile-remove(rich-text-editor-image-upload) */
onRemoveInlineImage: onRemoveInlineImage })))));
}
return sendBox;
};
// Move SendBox initialization to a separate component as otherwise it will cause re-render for Suspense and _ErrorBoundary when props and sendBoxProps are updated
const SendBoxWrapper = (props) => {
const sendBoxProps = usePropsFor(SendBox);
return React.createElement(SendBox, Object.assign({}, sendBoxProps, props));
};
//# sourceMappingURL=SendBoxPicker.js.map