npm - @azure/communication-react - Versions diffs - 1.15.0-alpha-202404030013 → 1.15.0-alpha-202404050013 - Mend

@azure/communication-react 1.15.0-alpha-202404030013 → 1.15.0-alpha-202404050013

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (174) hide show

package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextEditor.js CHANGED Viewed

@@ -10,6 +10,7 @@ import { ribbonButtons } from './Buttons/RichTextRibbonButtons';
 import { isDarkThemed } from '../../theming/themeUtils';
 import { ribbonButtonsStrings } from '../utils/RichTextEditorStringsUtils';
 import { createTableEditMenuProvider } from './Buttons/Table/RichTextTableContextMenu';
+import CopyPastePlugin from './Plugins/CopyPastePlugin';
 /**
  * A component to wrap RoosterJS Rich Text Editor.
  *
@@ -60,7 +61,16 @@ export const RichTextEditor = React.forwardRef((props, ref) => {
         const updateContentPlugin = createUpdateContentPlugin(UpdateMode.OnContentChangedEvent | UpdateMode.OnUserInput, (content) => {
             onChange && onChange(content);
         });
-        return [contentEdit, placeholderPlugin, updateContentPlugin, ribbonPlugin, contextPlugin, tableEditMenuProvider];
+        const copyPastePlugin = new CopyPastePlugin();
+        return [
+            contentEdit,
+            placeholderPlugin,
+            updateContentPlugin,
+            ribbonPlugin,
+            contextPlugin,
+            tableEditMenuProvider,
+            copyPastePlugin
+        ];
     }, [onChange, placeholderPlugin, ribbonPlugin, strings]);
     const ribbon = useMemo(() => {
         const buttons = ribbonButtons(theme);

package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextEditor.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RichTextEditor.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/RichTextEditor/RichTextEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\nimport React, { useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';\nimport { ContentEdit, Watermark } from 'roosterjs-editor-plugins';\nimport { Editor } from 'roosterjs-editor-core';\nimport type { DefaultFormat, EditorOptions, IEditor } from 'roosterjs-editor-types-compatible';\nimport {\n Rooster,\n createUpdateContentPlugin,\n UpdateMode,\n createRibbonPlugin,\n Ribbon,\n createContextMenuPlugin\n} from 'roosterjs-react';\nimport {\n ribbonButtonStyle,\n ribbonOverflowButtonStyle,\n ribbonStyle,\n richTextEditorWrapperStyle,\n richTextEditorStyle\n} from '../styles/RichTextEditor.styles';\nimport { useTheme } from '../../theming';\nimport { ribbonButtons } from './Buttons/RichTextRibbonButtons';\nimport { RichTextSendBoxStrings } from './RichTextSendBox';\nimport { isDarkThemed } from '../../theming/themeUtils';\nimport { ribbonButtonsStrings } from '../utils/RichTextEditorStringsUtils';\nimport { createTableEditMenuProvider } from './Buttons/Table/RichTextTableContextMenu';\n\n/*\n Props for {@link RichTextEditor}.\n \n @private\n /\nexport interface RichTextEditorStyleProps {\n minHeight: string;\n maxHeight: string;\n}\n\n/\n Props for {@link RichTextEditor}.\n \n @private\n /\nexport interface RichTextEditorProps {\n initialContent?: string;\n onChange: (newValue?: string) => void;\n onKeyDown?: (ev: React.KeyboardEvent<HTMLElement>) => void;\n placeholderText?: string;\n strings: Partial<RichTextSendBoxStrings>;\n showRichTextEditorFormatting: boolean;\n styles: RichTextEditorStyleProps;\n}\n\n/\n Props for {@link RichTextEditor}.\n \n @beta\n /\nexport interface RichTextEditorComponentRef {\n focus: () => void;\n setEmptyContent: () => void;\n}\n\n/\n A component to wrap RoosterJS Rich Text Editor.\n \n @beta\n */\nexport const RichTextEditor = React.forwardRef<RichTextEditorComponentRef, RichTextEditorProps>((props, ref) => {\n const { initialContent, onChange, placeholderText, strings, showRichTextEditorFormatting } = props;\n const editor = useRef<IEditor \| null>(null);\n const theme = useTheme();\n useImperativeHandle(\n ref,\n () => {\n return {\n focus() {\n if (editor.current) {\n editor.current.focus();\n }\n },\n setEmptyContent() {\n if (editor.current) {\n editor.current.setContent('');\n }\n }\n };\n },\n []\n );\n\n const ribbonPlugin = React.useMemo(() => {\n return createRibbonPlugin();\n }, []);\n\n const editorCreator = useCallback(\n (div: HTMLDivElement, options: EditorOptions) => {\n editor.current = new Editor(div, options);\n return editor.current;\n },\n // trigger force editor reset when strings are changed to update context menu strings\n // see RosterJS documentation for 'editorCreator' for more details\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [strings]\n );\n\n const placeholderPlugin = React.useMemo(() => {\n return new Watermark('');\n }, []);\n\n useEffect(() => {\n if (placeholderText !== undefined) {\n placeholderPlugin.updateWatermark(placeholderText);\n }\n }, [placeholderPlugin, placeholderText]);\n\n const plugins = useMemo(() => {\n // contextPlugin and tableEditMenuProvider allow to show insert/delete menu for the table\n const contextPlugin = createContextMenuPlugin();\n const tableEditMenuProvider = createTableEditMenuProvider(strings);\n const contentEdit = new ContentEdit();\n const updateContentPlugin = createUpdateContentPlugin(\n UpdateMode.OnContentChangedEvent \| UpdateMode.OnUserInput,\n (content: string) => {\n onChange && onChange(content);\n }\n );\n return [contentEdit, placeholderPlugin, updateContentPlugin, ribbonPlugin, contextPlugin, tableEditMenuProvider];\n }, [onChange, placeholderPlugin, ribbonPlugin, strings]);\n\n const ribbon = useMemo(() => {\n const buttons = ribbonButtons(theme);\n\n return (\n <Ribbon\n styles={ribbonStyle}\n buttons={buttons}\n plugin={ribbonPlugin}\n overflowButtonProps={{\n styles: ribbonButtonStyle(theme),\n menuProps: {\n items: [], // CommandBar will determine items rendered in overflow\n isBeakVisible: false,\n styles: ribbonOverflowButtonStyle(theme)\n }\n }}\n strings={ribbonButtonsStrings(strings)}\n data-testid={'rich-text-editor-ribbon'}\n />\n );\n }, [strings, ribbonPlugin, theme]);\n\n const defaultFormat: DefaultFormat = useMemo(() => {\n // without setting any styles, text input is not handled properly for tables (when insert or paste one in the editor)\n // because of https://github.com/microsoft/roosterjs/blob/14dbb947e3ae94580109cbd05e48ceb05327c4dc/packages/roosterjs-editor-core/lib/corePlugins/TypeInContainerPlugin.ts#L75\n // this issue is fixed for content model package\n return {\n backgroundColor: 'transparent'\n };\n }, []);\n\n return (\n <div data-testid={'rich-text-editor-wrapper'}>\n {showRichTextEditorFormatting && ribbon}\n <div className={richTextEditorWrapperStyle(theme, !showRichTextEditorFormatting)}>\n <Rooster\n defaultFormat={defaultFormat}\n initialContent={initialContent}\n inDarkMode={isDarkThemed(theme)}\n plugins={plugins}\n className={richTextEditorStyle(props.styles)}\n editorCreator={editorCreator}\n // TODO: confirm the color during inline images implementation\n imageSelectionBorderColor={'blue'}\n // doNotAdjustEditorColor is used to fix the default background color for Rooster component\n doNotAdjustEditorColor={true}\n data-testid={'rooster-rich-text-editor'}\n // if we don't use 'allowKeyboardEventPropagation' only the enter key is caught\n onKeyDown={props.onKeyDown}\n />\n </div>\n </div>\n );\n});\n"]}
1	+ {"version":3,"file":"RichTextEditor.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/RichTextEditor/RichTextEditor.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\nimport React, { useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';\nimport { ContentEdit, Watermark } from 'roosterjs-editor-plugins';\nimport { Editor } from 'roosterjs-editor-core';\nimport type { DefaultFormat, EditorOptions, IEditor } from 'roosterjs-editor-types-compatible';\nimport {\n Rooster,\n createUpdateContentPlugin,\n UpdateMode,\n createRibbonPlugin,\n Ribbon,\n createContextMenuPlugin\n} from 'roosterjs-react';\nimport {\n ribbonButtonStyle,\n ribbonOverflowButtonStyle,\n ribbonStyle,\n richTextEditorWrapperStyle,\n richTextEditorStyle\n} from '../styles/RichTextEditor.styles';\nimport { useTheme } from '../../theming';\nimport { ribbonButtons } from './Buttons/RichTextRibbonButtons';\nimport { RichTextSendBoxStrings } from './RichTextSendBox';\nimport { isDarkThemed } from '../../theming/themeUtils';\nimport { ribbonButtonsStrings } from '../utils/RichTextEditorStringsUtils';\nimport { createTableEditMenuProvider } from './Buttons/Table/RichTextTableContextMenu';\nimport CopyPastePlugin from './Plugins/CopyPastePlugin';\n\n/*\n Props for {@link RichTextEditor}.\n \n @private\n /\nexport interface RichTextEditorStyleProps {\n minHeight: string;\n maxHeight: string;\n}\n\n/\n Props for {@link RichTextEditor}.\n \n @private\n /\nexport interface RichTextEditorProps {\n initialContent?: string;\n onChange: (newValue?: string) => void;\n onKeyDown?: (ev: React.KeyboardEvent<HTMLElement>) => void;\n placeholderText?: string;\n strings: Partial<RichTextSendBoxStrings>;\n showRichTextEditorFormatting: boolean;\n styles: RichTextEditorStyleProps;\n}\n\n/\n Props for {@link RichTextEditor}.\n \n @beta\n /\nexport interface RichTextEditorComponentRef {\n focus: () => void;\n setEmptyContent: () => void;\n}\n\n/\n A component to wrap RoosterJS Rich Text Editor.\n \n @beta\n */\nexport const RichTextEditor = React.forwardRef<RichTextEditorComponentRef, RichTextEditorProps>((props, ref) => {\n const { initialContent, onChange, placeholderText, strings, showRichTextEditorFormatting } = props;\n const editor = useRef<IEditor \| null>(null);\n const theme = useTheme();\n useImperativeHandle(\n ref,\n () => {\n return {\n focus() {\n if (editor.current) {\n editor.current.focus();\n }\n },\n setEmptyContent() {\n if (editor.current) {\n editor.current.setContent('');\n }\n }\n };\n },\n []\n );\n\n const ribbonPlugin = React.useMemo(() => {\n return createRibbonPlugin();\n }, []);\n\n const editorCreator = useCallback(\n (div: HTMLDivElement, options: EditorOptions) => {\n editor.current = new Editor(div, options);\n return editor.current;\n },\n // trigger force editor reset when strings are changed to update context menu strings\n // see RosterJS documentation for 'editorCreator' for more details\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [strings]\n );\n\n const placeholderPlugin = React.useMemo(() => {\n return new Watermark('');\n }, []);\n\n useEffect(() => {\n if (placeholderText !== undefined) {\n placeholderPlugin.updateWatermark(placeholderText);\n }\n }, [placeholderPlugin, placeholderText]);\n\n const plugins = useMemo(() => {\n // contextPlugin and tableEditMenuProvider allow to show insert/delete menu for the table\n const contextPlugin = createContextMenuPlugin();\n const tableEditMenuProvider = createTableEditMenuProvider(strings);\n const contentEdit = new ContentEdit();\n const updateContentPlugin = createUpdateContentPlugin(\n UpdateMode.OnContentChangedEvent \| UpdateMode.OnUserInput,\n (content: string) => {\n onChange && onChange(content);\n }\n );\n const copyPastePlugin = new CopyPastePlugin();\n return [\n contentEdit,\n placeholderPlugin,\n updateContentPlugin,\n ribbonPlugin,\n contextPlugin,\n tableEditMenuProvider,\n copyPastePlugin\n ];\n }, [onChange, placeholderPlugin, ribbonPlugin, strings]);\n\n const ribbon = useMemo(() => {\n const buttons = ribbonButtons(theme);\n\n return (\n <Ribbon\n styles={ribbonStyle}\n buttons={buttons}\n plugin={ribbonPlugin}\n overflowButtonProps={{\n styles: ribbonButtonStyle(theme),\n menuProps: {\n items: [], // CommandBar will determine items rendered in overflow\n isBeakVisible: false,\n styles: ribbonOverflowButtonStyle(theme)\n }\n }}\n strings={ribbonButtonsStrings(strings)}\n data-testid={'rich-text-editor-ribbon'}\n />\n );\n }, [strings, ribbonPlugin, theme]);\n\n const defaultFormat: DefaultFormat = useMemo(() => {\n // without setting any styles, text input is not handled properly for tables (when insert or paste one in the editor)\n // because of https://github.com/microsoft/roosterjs/blob/14dbb947e3ae94580109cbd05e48ceb05327c4dc/packages/roosterjs-editor-core/lib/corePlugins/TypeInContainerPlugin.ts#L75\n // this issue is fixed for content model package\n return {\n backgroundColor: 'transparent'\n };\n }, []);\n\n return (\n <div data-testid={'rich-text-editor-wrapper'}>\n {showRichTextEditorFormatting && ribbon}\n <div className={richTextEditorWrapperStyle(theme, !showRichTextEditorFormatting)}>\n <Rooster\n defaultFormat={defaultFormat}\n initialContent={initialContent}\n inDarkMode={isDarkThemed(theme)}\n plugins={plugins}\n className={richTextEditorStyle(props.styles)}\n editorCreator={editorCreator}\n // TODO: confirm the color during inline images implementation\n imageSelectionBorderColor={'blue'}\n // doNotAdjustEditorColor is used to fix the default background color for Rooster component\n doNotAdjustEditorColor={true}\n data-testid={'rooster-rich-text-editor'}\n // if we don't use 'allowKeyboardEventPropagation' only the enter key is caught\n onKeyDown={props.onKeyDown}\n />\n </div>\n </div>\n );\n});\n"]}

package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextInputBoxComponent.js CHANGED Viewed

@@ -13,9 +13,9 @@ import { inputBoxContentStackStyle, inputBoxRichTextStackItemStyle, inputBoxRich
  */
 export const RichTextInputBoxComponent = (props) => {
     const { placeholderText, initialContent, onChange, onEnterKeyDown, editorComponentRef, disabled, strings, actionComponents,
-    /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+    /* @conditional-compile-remove(attachment-upload) */
     onRenderAttachmentUploads,
-    /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+    /* @conditional-compile-remove(attachment-upload) */
     hasAttachments, richTextEditorStyleProps, isHorizontalLayoutDisabled = false } = props;
     const theme = useTheme();
     const [showRichTextEditorFormatting, setShowRichTextEditorFormatting] = useState(false);
@@ -54,11 +54,11 @@ export const RichTextInputBoxComponent = (props) => {
     const useHorizontalLayout = useMemo(() => {
         return (!isHorizontalLayoutDisabled &&
             !showRichTextEditorFormatting &&
-            /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */ !hasAttachments);
+            /* @conditional-compile-remove(attachment-upload) */ !hasAttachments);
     }, [
         isHorizontalLayoutDisabled,
         showRichTextEditorFormatting,
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */ hasAttachments
+        /* @conditional-compile-remove(attachment-upload) */ hasAttachments
     ]);
     return (React.createElement("div", { className: richTextBorderBoxStyle({
             theme: theme,
@@ -68,7 +68,7 @@ export const RichTextInputBoxComponent = (props) => {
             React.createElement(Stack, { grow: true, className: inputBoxRichTextStackStyle },
                 React.createElement(Stack.Item, { className: inputBoxRichTextStackItemStyle },
                     React.createElement(RichTextEditor, { initialContent: initialContent, placeholderText: placeholderText, onChange: onChange, onKeyDown: onKeyDown, ref: editorComponentRef, strings: strings, showRichTextEditorFormatting: showRichTextEditorFormatting, styles: richTextEditorStyle })),
-                /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */ onRenderAttachmentUploads &&
+                /* @conditional-compile-remove(attachment-upload) */ onRenderAttachmentUploads &&
                     onRenderAttachmentUploads()),
             actionButtons)));
 };

package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextInputBoxComponent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RichTextInputBoxComponent.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/RichTextEditor/RichTextInputBoxComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { ReactNode, useCallback, useMemo, useState } from 'react';\nimport { BaseCustomStyles } from '../../types';\nimport { RichTextEditor, RichTextEditorComponentRef, RichTextEditorStyleProps } from './RichTextEditor';\nimport { RichTextSendBoxStrings } from './RichTextSendBox';\nimport { useTheme } from '../../theming';\nimport { Icon, Stack } from '@fluentui/react';\nimport { InputBoxButton } from '../InputBoxButton';\nimport { isEnterKeyEventFromCompositionSession } from '../utils';\nimport {\n richTextActionButtonsDividerStyle,\n richTextActionButtonsStackStyle,\n richTextActionButtonsStyle,\n richTextFormatButtonIconStyle\n} from '../styles/RichTextEditor.styles';\nimport {\n inputBoxContentStackStyle,\n inputBoxRichTextStackItemStyle,\n inputBoxRichTextStackStyle,\n richTextBorderBoxStyle\n} from '../styles/RichTextInputBoxComponent.styles';\n\n/*\n @private\n /\nexport interface RichTextInputBoxComponentStylesProps extends BaseCustomStyles {}\n\n/\n @private\n /\nexport interface RichTextInputBoxComponentProps {\n placeholderText?: string;\n initialContent?: string;\n onChange: (newValue?: string) => void;\n onEnterKeyDown?: () => void;\n editorComponentRef: React.RefObject<RichTextEditorComponentRef>;\n strings: Partial<RichTextSendBoxStrings>;\n disabled: boolean;\n actionComponents: ReactNode;\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n onRenderAttachmentUploads?: () => JSX.Element;\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n hasAttachments?: boolean;\n // props for min and max height for the rich text editor\n // otherwise the editor will grow to fit the content\n richTextEditorStyleProps: (isExpanded: boolean) => RichTextEditorStyleProps;\n isHorizontalLayoutDisabled?: boolean;\n}\n\n/\n @private\n /\nexport const RichTextInputBoxComponent = (props: RichTextInputBoxComponentProps): JSX.Element => {\n const {\n placeholderText,\n initialContent,\n onChange,\n onEnterKeyDown,\n editorComponentRef,\n disabled,\n strings,\n actionComponents,\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n onRenderAttachmentUploads,\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n hasAttachments,\n richTextEditorStyleProps,\n isHorizontalLayoutDisabled = false\n } = props;\n const theme = useTheme();\n const [showRichTextEditorFormatting, setShowRichTextEditorFormatting] = useState(false);\n\n const onRenderRichTextEditorIcon = useCallback(\n (isHover: boolean) => (\n <Icon\n iconName={\n isHover \|\| showRichTextEditorFormatting ? 'RichTextEditorButtonIconFilled' : 'RichTextEditorButtonIcon'\n }\n className={richTextFormatButtonIconStyle(theme, !disabled && (isHover \|\| showRichTextEditorFormatting))}\n />\n ),\n [disabled, showRichTextEditorFormatting, theme]\n );\n\n const actionButtons = useMemo(() => {\n return (\n <Stack.Item align=\"end\" className={richTextActionButtonsStackStyle}>\n <Stack horizontal>\n <InputBoxButton\n onRenderIcon={onRenderRichTextEditorIcon}\n onClick={(e) => {\n setShowRichTextEditorFormatting(!showRichTextEditorFormatting);\n editorComponentRef.current?.focus();\n e.stopPropagation(); // Prevents the click from bubbling up and triggering a focus event on the chat.\n }}\n ariaLabel={strings.richTextFormatButtonTooltip}\n tooltipContent={strings.richTextFormatButtonTooltip}\n className={richTextActionButtonsStyle}\n data-testId={'rich-text-input-box-format-button'}\n />\n <Icon iconName=\"RichTextDividerIcon\" className={richTextActionButtonsDividerStyle(theme)} />\n {actionComponents}\n </Stack>\n </Stack.Item>\n );\n }, [\n actionComponents,\n editorComponentRef,\n onRenderRichTextEditorIcon,\n showRichTextEditorFormatting,\n strings.richTextFormatButtonTooltip,\n theme\n ]);\n\n const richTextEditorStyle = useMemo(() => {\n return richTextEditorStyleProps(showRichTextEditorFormatting);\n }, [richTextEditorStyleProps, showRichTextEditorFormatting]);\n\n const onKeyDown = useCallback(\n (ev: React.KeyboardEvent<HTMLElement>) => {\n if (isEnterKeyEventFromCompositionSession(ev)) {\n return;\n }\n if (ev.key === 'Enter' && ev.shiftKey === false && !showRichTextEditorFormatting) {\n ev.preventDefault();\n onEnterKeyDown && onEnterKeyDown();\n }\n },\n [onEnterKeyDown, showRichTextEditorFormatting]\n );\n\n const useHorizontalLayout = useMemo(() => {\n return (\n !isHorizontalLayoutDisabled &&\n !showRichTextEditorFormatting &&\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) / !hasAttachments\n );\n }, [\n isHorizontalLayoutDisabled,\n showRichTextEditorFormatting,\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) / hasAttachments\n ]);\n\n return (\n <div\n className={richTextBorderBoxStyle({\n theme: theme,\n disabled: !!disabled\n })}\n >\n {/ This layout is used for the compact view when formatting options are not shown /}\n <Stack\n grow\n horizontal={useHorizontalLayout}\n horizontalAlign={useHorizontalLayout ? 'end' : 'space-between'}\n className={inputBoxContentStackStyle}\n wrap={useHorizontalLayout}\n >\n {/ Fixes the issue when flex box can grow to be bigger than parent /}\n <Stack grow className={inputBoxRichTextStackStyle}>\n <Stack.Item className={inputBoxRichTextStackItemStyle}>\n <RichTextEditor\n initialContent={initialContent}\n placeholderText={placeholderText}\n onChange={onChange}\n onKeyDown={onKeyDown}\n ref={editorComponentRef}\n strings={strings}\n showRichTextEditorFormatting={showRichTextEditorFormatting}\n styles={richTextEditorStyle}\n />\n </Stack.Item>\n {\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */ onRenderAttachmentUploads &&\n onRenderAttachmentUploads()\n }\n </Stack>\n {actionButtons}\n </Stack>\n </div>\n );\n};\n"]}
1	+ {"version":3,"file":"RichTextInputBoxComponent.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/RichTextEditor/RichTextInputBoxComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { ReactNode, useCallback, useMemo, useState } from 'react';\nimport { BaseCustomStyles } from '../../types';\nimport { RichTextEditor, RichTextEditorComponentRef, RichTextEditorStyleProps } from './RichTextEditor';\nimport { RichTextSendBoxStrings } from './RichTextSendBox';\nimport { useTheme } from '../../theming';\nimport { Icon, Stack } from '@fluentui/react';\nimport { InputBoxButton } from '../InputBoxButton';\nimport { isEnterKeyEventFromCompositionSession } from '../utils';\nimport {\n richTextActionButtonsDividerStyle,\n richTextActionButtonsStackStyle,\n richTextActionButtonsStyle,\n richTextFormatButtonIconStyle\n} from '../styles/RichTextEditor.styles';\nimport {\n inputBoxContentStackStyle,\n inputBoxRichTextStackItemStyle,\n inputBoxRichTextStackStyle,\n richTextBorderBoxStyle\n} from '../styles/RichTextInputBoxComponent.styles';\n\n/*\n @private\n /\nexport interface RichTextInputBoxComponentStylesProps extends BaseCustomStyles {}\n\n/\n @private\n /\nexport interface RichTextInputBoxComponentProps {\n placeholderText?: string;\n initialContent?: string;\n onChange: (newValue?: string) => void;\n onEnterKeyDown?: () => void;\n editorComponentRef: React.RefObject<RichTextEditorComponentRef>;\n strings: Partial<RichTextSendBoxStrings>;\n disabled: boolean;\n actionComponents: ReactNode;\n / @conditional-compile-remove(attachment-upload) /\n onRenderAttachmentUploads?: () => JSX.Element;\n / @conditional-compile-remove(attachment-upload) /\n hasAttachments?: boolean;\n // props for min and max height for the rich text editor\n // otherwise the editor will grow to fit the content\n richTextEditorStyleProps: (isExpanded: boolean) => RichTextEditorStyleProps;\n isHorizontalLayoutDisabled?: boolean;\n}\n\n/\n @private\n /\nexport const RichTextInputBoxComponent = (props: RichTextInputBoxComponentProps): JSX.Element => {\n const {\n placeholderText,\n initialContent,\n onChange,\n onEnterKeyDown,\n editorComponentRef,\n disabled,\n strings,\n actionComponents,\n / @conditional-compile-remove(attachment-upload) /\n onRenderAttachmentUploads,\n / @conditional-compile-remove(attachment-upload) /\n hasAttachments,\n richTextEditorStyleProps,\n isHorizontalLayoutDisabled = false\n } = props;\n const theme = useTheme();\n const [showRichTextEditorFormatting, setShowRichTextEditorFormatting] = useState(false);\n\n const onRenderRichTextEditorIcon = useCallback(\n (isHover: boolean) => (\n <Icon\n iconName={\n isHover \|\| showRichTextEditorFormatting ? 'RichTextEditorButtonIconFilled' : 'RichTextEditorButtonIcon'\n }\n className={richTextFormatButtonIconStyle(theme, !disabled && (isHover \|\| showRichTextEditorFormatting))}\n />\n ),\n [disabled, showRichTextEditorFormatting, theme]\n );\n\n const actionButtons = useMemo(() => {\n return (\n <Stack.Item align=\"end\" className={richTextActionButtonsStackStyle}>\n <Stack horizontal>\n <InputBoxButton\n onRenderIcon={onRenderRichTextEditorIcon}\n onClick={(e) => {\n setShowRichTextEditorFormatting(!showRichTextEditorFormatting);\n editorComponentRef.current?.focus();\n e.stopPropagation(); // Prevents the click from bubbling up and triggering a focus event on the chat.\n }}\n ariaLabel={strings.richTextFormatButtonTooltip}\n tooltipContent={strings.richTextFormatButtonTooltip}\n className={richTextActionButtonsStyle}\n data-testId={'rich-text-input-box-format-button'}\n />\n <Icon iconName=\"RichTextDividerIcon\" className={richTextActionButtonsDividerStyle(theme)} />\n {actionComponents}\n </Stack>\n </Stack.Item>\n );\n }, [\n actionComponents,\n editorComponentRef,\n onRenderRichTextEditorIcon,\n showRichTextEditorFormatting,\n strings.richTextFormatButtonTooltip,\n theme\n ]);\n\n const richTextEditorStyle = useMemo(() => {\n return richTextEditorStyleProps(showRichTextEditorFormatting);\n }, [richTextEditorStyleProps, showRichTextEditorFormatting]);\n\n const onKeyDown = useCallback(\n (ev: React.KeyboardEvent<HTMLElement>) => {\n if (isEnterKeyEventFromCompositionSession(ev)) {\n return;\n }\n if (ev.key === 'Enter' && ev.shiftKey === false && !showRichTextEditorFormatting) {\n ev.preventDefault();\n onEnterKeyDown && onEnterKeyDown();\n }\n },\n [onEnterKeyDown, showRichTextEditorFormatting]\n );\n\n const useHorizontalLayout = useMemo(() => {\n return (\n !isHorizontalLayoutDisabled &&\n !showRichTextEditorFormatting &&\n / @conditional-compile-remove(attachment-upload) / !hasAttachments\n );\n }, [\n isHorizontalLayoutDisabled,\n showRichTextEditorFormatting,\n / @conditional-compile-remove(attachment-upload) / hasAttachments\n ]);\n\n return (\n <div\n className={richTextBorderBoxStyle({\n theme: theme,\n disabled: !!disabled\n })}\n >\n {/ This layout is used for the compact view when formatting options are not shown /}\n <Stack\n grow\n horizontal={useHorizontalLayout}\n horizontalAlign={useHorizontalLayout ? 'end' : 'space-between'}\n className={inputBoxContentStackStyle}\n wrap={useHorizontalLayout}\n >\n {/ Fixes the issue when flex box can grow to be bigger than parent /}\n <Stack grow className={inputBoxRichTextStackStyle}>\n <Stack.Item className={inputBoxRichTextStackItemStyle}>\n <RichTextEditor\n initialContent={initialContent}\n placeholderText={placeholderText}\n onChange={onChange}\n onKeyDown={onKeyDown}\n ref={editorComponentRef}\n strings={strings}\n showRichTextEditorFormatting={showRichTextEditorFormatting}\n styles={richTextEditorStyle}\n />\n </Stack.Item>\n {\n / @conditional-compile-remove(attachment-upload) */ onRenderAttachmentUploads &&\n onRenderAttachmentUploads()\n }\n </Stack>\n {actionButtons}\n </Stack>\n </div>\n );\n};\n"]}

package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextSendBox.js CHANGED Viewed

@@ -10,13 +10,13 @@ import { RichTextSendBoxErrors } from './RichTextSendBoxErrors';
 import { isMessageTooLong, sanitizeText } from '../utils/SendBoxUtils';
 import { useTheme } from '../../theming';
 import { richTextActionButtonsStyle, sendBoxRichTextEditorStyle } from '../styles/RichTextEditor.styles';
-/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+/* @conditional-compile-remove(attachment-upload) */
 import { _AttachmentUploadCards } from '../AttachmentUploadCards';
-/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+/* @conditional-compile-remove(attachment-upload) */
 import { hasCompletedAttachmentUploads, hasIncompleteAttachmentUploads } from '../utils/SendBoxUtils';
-/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+/* @conditional-compile-remove(attachment-upload) */
 import { attachmentUploadCardsStyles } from '../styles/SendBox.styles';
-/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+/* @conditional-compile-remove(attachment-upload) */
 import { FluentV9ThemeProvider } from '../../theming/FluentV9ThemeProvider';
 /**
  * A component to render SendBox with Rich Text Editor support.
@@ -25,9 +25,9 @@ import { FluentV9ThemeProvider } from '../../theming/FluentV9ThemeProvider';
  */
 export const RichTextSendBox = (props) => {
     const { disabled = false, systemMessage, onSendMessage,
-    /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+    /* @conditional-compile-remove(attachment-upload) */
     activeAttachmentUploads,
-    /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+    /* @conditional-compile-remove(attachment-upload) */
     onCancelAttachmentUpload } = props;
     const theme = useTheme();
     const locale = useLocale();
@@ -41,7 +41,7 @@ export const RichTextSendBox = (props) => {
     }, [localeStrings, props.strings]);
     const [contentValue, setContentValue] = useState('');
     const [contentValueOverflow, setContentValueOverflow] = useState(false);
-    /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+    /* @conditional-compile-remove(attachment-upload) */
     const [attachmentUploadsPendingError, setAttachmentUploadsPendingError] = useState(undefined);
     const editorComponentRef = useRef(null);
     const contentTooLongMessage = useMemo(() => (contentValueOverflow ? strings.textTooLong : undefined), [contentValueOverflow, strings.textTooLong]);
@@ -58,9 +58,9 @@ export const RichTextSendBox = (props) => {
             return;
         }
         // Don't send message until all attachments have been uploaded successfully
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+        /* @conditional-compile-remove(attachment-upload) */
         setAttachmentUploadsPendingError(undefined);
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+        /* @conditional-compile-remove(attachment-upload) */
         if (hasIncompleteAttachmentUploads(activeAttachmentUploads)) {
             setAttachmentUploadsPendingError({ message: strings.attachmentUploadsPendingError, timestamp: Date.now() });
             return;
@@ -69,7 +69,7 @@ export const RichTextSendBox = (props) => {
         // we don't want to send empty messages including spaces, newlines, tabs
         // Message can be empty if there is a valid attachment upload
         if (sanitizeText(message).length > 0 ||
-            /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */ hasCompletedAttachmentUploads(activeAttachmentUploads)) {
+            /* @conditional-compile-remove(attachment-upload) */ hasCompletedAttachmentUploads(activeAttachmentUploads)) {
             onSendMessage(message);
             setContentValue('');
             (_a = editorComponentRef.current) === null || _a === void 0 ? void 0 : _a.setEmptyContent();
@@ -80,29 +80,29 @@ export const RichTextSendBox = (props) => {
         contentValueOverflow,
         disabled,
         onSendMessage,
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */ activeAttachmentUploads,
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */ strings.attachmentUploadsPendingError
+        /* @conditional-compile-remove(attachment-upload) */ activeAttachmentUploads,
+        /* @conditional-compile-remove(attachment-upload) */ strings.attachmentUploadsPendingError
     ]);
     const hasErrorMessage = useMemo(() => {
         var _a;
         return (!!systemMessage ||
             !!contentTooLongMessage ||
-            /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+            /* @conditional-compile-remove(attachment-upload) */
             !!attachmentUploadsPendingError ||
-            /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+            /* @conditional-compile-remove(attachment-upload) */
             !!((_a = activeAttachmentUploads === null || activeAttachmentUploads === void 0 ? void 0 : activeAttachmentUploads.filter((attachmentUpload) => attachmentUpload.uploadError).pop()) === null || _a === void 0 ? void 0 : _a.uploadError));
     }, [
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+        /* @conditional-compile-remove(attachment-upload) */
         activeAttachmentUploads,
         contentTooLongMessage,
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+        /* @conditional-compile-remove(attachment-upload) */
         attachmentUploadsPendingError,
         systemMessage
     ]);
     const onRenderSendIcon = useCallback((isHover) => (React.createElement(Icon, { iconName: isHover && contentValue ? 'SendBoxSendHovered' : 'SendBoxSend', className: sendIconStyle({
             theme,
             hasText: !!contentValue,
-            /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+            /* @conditional-compile-remove(attachment-upload) */
             hasAttachment: false,
             hasErrorMessage: hasErrorMessage,
             defaultTextColor: theme.palette.neutralSecondary,
@@ -111,22 +111,22 @@ export const RichTextSendBox = (props) => {
     const sendBoxErrorsProps = useMemo(() => {
         var _a;
         return {
-            /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+            /* @conditional-compile-remove(attachment-upload) */
             attachmentUploadsPendingError: attachmentUploadsPendingError,
-            /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+            /* @conditional-compile-remove(attachment-upload) */
             attachmentUploadError: (_a = activeAttachmentUploads === null || activeAttachmentUploads === void 0 ? void 0 : activeAttachmentUploads.filter((attachmentUpload) => attachmentUpload.uploadError).pop()) === null || _a === void 0 ? void 0 : _a.uploadError,
             systemMessage: systemMessage,
             textTooLongMessage: contentTooLongMessage
         };
     }, [
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+        /* @conditional-compile-remove(attachment-upload) */
         activeAttachmentUploads,
         contentTooLongMessage,
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+        /* @conditional-compile-remove(attachment-upload) */
         attachmentUploadsPendingError,
         systemMessage
     ]);
-    /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+    /* @conditional-compile-remove(attachment-upload) */
     const onRenderAttachmentUploads = useCallback(() => {
         return (React.createElement(Stack, { className: attachmentUploadCardsStyles },
             React.createElement(FluentV9ThemeProvider, { v8Theme: theme },
@@ -149,16 +149,16 @@ export const RichTextSendBox = (props) => {
                 e.stopPropagation(); // Prevents the click from bubbling up and triggering a focus event on the chat.
             }, className: richTextActionButtonsStyle, ariaLabel: localeStrings.sendButtonAriaLabel, tooltipContent: localeStrings.sendButtonAriaLabel }));
     }, [localeStrings.sendButtonAriaLabel, onRenderSendIcon, sendMessageOnClick]);
-    /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+    /* @conditional-compile-remove(attachment-upload) */
     const hasAttachmentUploads = useMemo(() => {
         return (hasCompletedAttachmentUploads(activeAttachmentUploads) || hasIncompleteAttachmentUploads(activeAttachmentUploads));
     }, [activeAttachmentUploads]);
     return (React.createElement(Stack, null,
         React.createElement(RichTextSendBoxErrors, Object.assign({}, sendBoxErrorsProps)),
         React.createElement(RichTextInputBoxComponent, { placeholderText: strings.placeholderText, onChange: setContent, onEnterKeyDown: sendMessageOnClick, editorComponentRef: editorComponentRef, strings: strings, disabled: disabled, actionComponents: sendButton, richTextEditorStyleProps: sendBoxRichTextEditorStyle,
-            /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+            /* @conditional-compile-remove(attachment-upload) */
             onRenderAttachmentUploads: onRenderAttachmentUploads,
-            /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+            /* @conditional-compile-remove(attachment-upload) */
             hasAttachments: hasAttachmentUploads })));
 };
 //# sourceMappingURL=RichTextSendBox.js.map

package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextSendBox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RichTextSendBox.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/RichTextEditor/RichTextSendBox.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { RichTextInputBoxComponent } from './RichTextInputBoxComponent';\nimport { Icon, Stack } from '@fluentui/react';\nimport { useLocale } from '../../localization';\nimport { SendBoxStrings } from '../SendBox';\nimport { sendIconStyle } from '../styles/SendBox.styles';\nimport { InputBoxButton } from '../InputBoxButton';\nimport { RichTextSendBoxErrors, RichTextSendBoxErrorsProps } from './RichTextSendBoxErrors';\nimport { isMessageTooLong, sanitizeText } from '../utils/SendBoxUtils';\nimport { RichTextEditorComponentRef } from './RichTextEditor';\nimport { useTheme } from '../../theming';\nimport { richTextActionButtonsStyle, sendBoxRichTextEditorStyle } from '../styles/RichTextEditor.styles';\n/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\nimport { _AttachmentUploadCards } from '../AttachmentUploadCards';\n/ @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\nimport { AttachmentMetadata } from '../../types/Attachment';\n/ @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\nimport { hasCompletedAttachmentUploads, hasIncompleteAttachmentUploads } from '../utils/SendBoxUtils';\n/ @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\nimport { SendBoxErrorBarError } from '../SendBoxErrorBar';\n/ @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\nimport { attachmentUploadCardsStyles } from '../styles/SendBox.styles';\n/ @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\nimport { FluentV9ThemeProvider } from '../../theming/FluentV9ThemeProvider';\n\n/\n Strings of {@link RichTextSendBox} that can be overridden.\n \n @beta\n /\nexport interface RichTextSendBoxStrings extends SendBoxStrings {\n /\n Tooltip text for the bold button.\n /\n boldTooltip: string;\n /\n Tooltip text for the italic button.\n /\n italicTooltip: string;\n /\n Tooltip text for the underline button.\n /\n underlineTooltip: string;\n /\n Tooltip text for the bullet list button.\n /\n bulletListTooltip: string;\n /\n Tooltip text for the number list button.\n /\n numberListTooltip: string;\n /\n Tooltip text for the increase indent button.\n /\n increaseIndentTooltip: string;\n /\n Tooltip text for the decrease indent button.\n /\n decreaseIndentTooltip: string;\n /\n Tooltip text insert table button.\n /\n insertTableTooltip: string;\n /\n Tooltip text for the rich text format button button.\n /\n richTextFormatButtonTooltip: string;\n /\n Text for the insert menu item.\n /\n insertRowOrColumnMenu: string;\n /\n Title for the insert table menu.\n /\n insertTableMenuTitle: string;\n /\n Text for the insert menu item to insert row above the current selection.\n /\n insertRowAboveMenu: string;\n /\n Text for the insert menu item to insert row below the current selection.\n /\n insertRowBelowMenu: string;\n /\n Text for the insert menu item to insert column to the left from the current selection.\n /\n insertColumnLeftMenu: string;\n /\n Text for the insert menu item to insert column to the right from the current selection.\n /\n insertColumnRightMenu: string;\n /\n Text for the delete row or column menu.\n /\n deleteRowOrColumnMenu: string;\n /\n Text for the delete column menu.\n /\n deleteColumnMenu: string;\n /\n Text for the delete row menu.\n /\n deleteRowMenu: string;\n /\n Text for the delete table menu.\n /\n deleteTableMenu: string;\n}\n\n/\n Props for {@link RichTextSendBox}.\n \n @beta\n /\nexport interface RichTextSendBoxProps {\n /\n Optional boolean to disable text box\n * @defaultValue false\n /\n disabled?: boolean;\n /\n Optional strings to override in component\n /\n strings?: Partial<RichTextSendBoxStrings>;\n /\n Optional text for system message above the text box\n /\n systemMessage?: string;\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n /\n Optional array of active attachment uploads where each object has attributes\n * of a attachment upload like name, progress, errorMessage etc.\n * @beta\n /\n activeAttachmentUploads?: AttachmentMetadata[];\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n /\n Optional callback to remove the attachment upload before sending by clicking on\n * cancel icon.\n * @beta\n /\n onCancelAttachmentUpload?: (attachmentId: string) => void;\n /\n Callback function used when the send button is clicked.\n /\n onSendMessage: (content: string) => Promise<void>;\n}\n\n/\n A component to render SendBox with Rich Text Editor support.\n \n @beta\n /\nexport const RichTextSendBox = (props: RichTextSendBoxProps): JSX.Element => {\n const {\n disabled = false,\n systemMessage,\n onSendMessage,\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n activeAttachmentUploads,\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n onCancelAttachmentUpload\n } = props;\n\n const theme = useTheme();\n const locale = useLocale();\n\n const localeStrings = useMemo(() => {\n / @conditional-compile-remove(rich-text-editor) /\n return locale.strings.richTextSendBox;\n return locale.strings.sendBox;\n }, [/ @conditional-compile-remove(rich-text-editor) / locale.strings.richTextSendBox, locale.strings.sendBox]);\n\n const strings = useMemo(() => {\n return { ...localeStrings, ...props.strings };\n }, [localeStrings, props.strings]);\n\n const [contentValue, setContentValue] = useState('');\n const [contentValueOverflow, setContentValueOverflow] = useState(false);\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n const [attachmentUploadsPendingError, setAttachmentUploadsPendingError] = useState<SendBoxErrorBarError \| undefined>(\n undefined\n );\n const editorComponentRef = useRef<RichTextEditorComponentRef>(null);\n\n const contentTooLongMessage = useMemo(\n () => (contentValueOverflow ? strings.textTooLong : undefined),\n [contentValueOverflow, strings.textTooLong]\n );\n\n const setContent = useCallback((newValue?: string): void => {\n if (newValue === undefined) {\n return;\n }\n\n setContentValueOverflow(isMessageTooLong(newValue.length));\n setContentValue(newValue);\n }, []);\n\n const sendMessageOnClick = useCallback((): void => {\n if (disabled \|\| contentValueOverflow) {\n return;\n }\n // Don't send message until all attachments have been uploaded successfully\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n setAttachmentUploadsPendingError(undefined);\n\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n if (hasIncompleteAttachmentUploads(activeAttachmentUploads)) {\n setAttachmentUploadsPendingError({ message: strings.attachmentUploadsPendingError, timestamp: Date.now() });\n return;\n }\n\n const message = contentValue;\n // we don't want to send empty messages including spaces, newlines, tabs\n // Message can be empty if there is a valid attachment upload\n if (\n sanitizeText(message).length > 0 \|\|\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) / hasCompletedAttachmentUploads(\n activeAttachmentUploads\n )\n ) {\n onSendMessage(message);\n setContentValue('');\n editorComponentRef.current?.setEmptyContent();\n }\n editorComponentRef.current?.focus();\n }, [\n contentValue,\n contentValueOverflow,\n disabled,\n onSendMessage,\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) / activeAttachmentUploads,\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) / strings.attachmentUploadsPendingError\n ]);\n\n const hasErrorMessage = useMemo(() => {\n return (\n !!systemMessage \|\|\n !!contentTooLongMessage \|\|\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n !!attachmentUploadsPendingError \|\|\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n !!activeAttachmentUploads?.filter((attachmentUpload) => attachmentUpload.uploadError).pop()?.uploadError\n );\n }, [\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n activeAttachmentUploads,\n contentTooLongMessage,\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n attachmentUploadsPendingError,\n systemMessage\n ]);\n\n const onRenderSendIcon = useCallback(\n (isHover: boolean) => (\n <Icon\n iconName={isHover && contentValue ? 'SendBoxSendHovered' : 'SendBoxSend'}\n className={sendIconStyle({\n theme,\n hasText: !!contentValue,\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n hasAttachment: false,\n hasErrorMessage: hasErrorMessage,\n defaultTextColor: theme.palette.neutralSecondary,\n disabled: disabled\n })}\n />\n ),\n [contentValue, disabled, hasErrorMessage, theme]\n );\n\n const sendBoxErrorsProps: RichTextSendBoxErrorsProps = useMemo(() => {\n return {\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n attachmentUploadsPendingError: attachmentUploadsPendingError,\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n attachmentUploadError: activeAttachmentUploads?.filter((attachmentUpload) => attachmentUpload.uploadError).pop()\n ?.uploadError,\n systemMessage: systemMessage,\n textTooLongMessage: contentTooLongMessage\n };\n }, [\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n activeAttachmentUploads,\n contentTooLongMessage,\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n attachmentUploadsPendingError,\n systemMessage\n ]);\n\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n const onRenderAttachmentUploads = useCallback(() => {\n return (\n <Stack className={attachmentUploadCardsStyles}>\n <FluentV9ThemeProvider v8Theme={theme}>\n <_AttachmentUploadCards\n activeAttachmentUploads={activeAttachmentUploads}\n onCancelAttachmentUpload={onCancelAttachmentUpload}\n strings={{\n removeAttachment: strings.removeAttachment,\n uploading: strings.uploading,\n uploadCompleted: strings.uploadCompleted\n }}\n />\n </FluentV9ThemeProvider>\n </Stack>\n );\n }, [\n activeAttachmentUploads,\n onCancelAttachmentUpload,\n strings.removeAttachment,\n strings.uploadCompleted,\n strings.uploading,\n theme\n ]);\n\n const sendButton = useMemo(() => {\n return (\n <InputBoxButton\n onRenderIcon={onRenderSendIcon}\n onClick={(e) => {\n sendMessageOnClick();\n e.stopPropagation(); // Prevents the click from bubbling up and triggering a focus event on the chat.\n }}\n className={richTextActionButtonsStyle}\n ariaLabel={localeStrings.sendButtonAriaLabel}\n tooltipContent={localeStrings.sendButtonAriaLabel}\n />\n );\n }, [localeStrings.sendButtonAriaLabel, onRenderSendIcon, sendMessageOnClick]);\n\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n const hasAttachmentUploads = useMemo(() => {\n return (\n hasCompletedAttachmentUploads(activeAttachmentUploads) \|\| hasIncompleteAttachmentUploads(activeAttachmentUploads)\n );\n }, [activeAttachmentUploads]);\n\n return (\n <Stack>\n <RichTextSendBoxErrors {...sendBoxErrorsProps} />\n <RichTextInputBoxComponent\n placeholderText={strings.placeholderText}\n onChange={setContent}\n onEnterKeyDown={sendMessageOnClick}\n editorComponentRef={editorComponentRef}\n strings={strings}\n disabled={disabled}\n actionComponents={sendButton}\n richTextEditorStyleProps={sendBoxRichTextEditorStyle}\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) /\n onRenderAttachmentUploads={onRenderAttachmentUploads}\n / @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */\n hasAttachments={hasAttachmentUploads}\n />\n </Stack>\n );\n};\n"]}
1	+ {"version":3,"file":"RichTextSendBox.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/RichTextEditor/RichTextSendBox.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { RichTextInputBoxComponent } from './RichTextInputBoxComponent';\nimport { Icon, Stack } from '@fluentui/react';\nimport { useLocale } from '../../localization';\nimport { SendBoxStrings } from '../SendBox';\nimport { sendIconStyle } from '../styles/SendBox.styles';\nimport { InputBoxButton } from '../InputBoxButton';\nimport { RichTextSendBoxErrors, RichTextSendBoxErrorsProps } from './RichTextSendBoxErrors';\nimport { isMessageTooLong, sanitizeText } from '../utils/SendBoxUtils';\nimport { RichTextEditorComponentRef } from './RichTextEditor';\nimport { useTheme } from '../../theming';\nimport { richTextActionButtonsStyle, sendBoxRichTextEditorStyle } from '../styles/RichTextEditor.styles';\n/* @conditional-compile-remove(attachment-upload) /\nimport { _AttachmentUploadCards } from '../AttachmentUploadCards';\n/ @conditional-compile-remove(attachment-upload) /\nimport { AttachmentMetadata } from '../../types/Attachment';\n/ @conditional-compile-remove(attachment-upload) /\nimport { hasCompletedAttachmentUploads, hasIncompleteAttachmentUploads } from '../utils/SendBoxUtils';\n/ @conditional-compile-remove(attachment-upload) /\nimport { SendBoxErrorBarError } from '../SendBoxErrorBar';\n/ @conditional-compile-remove(attachment-upload) /\nimport { attachmentUploadCardsStyles } from '../styles/SendBox.styles';\n/ @conditional-compile-remove(attachment-upload) /\nimport { FluentV9ThemeProvider } from '../../theming/FluentV9ThemeProvider';\n\n/\n Strings of {@link RichTextSendBox} that can be overridden.\n \n @beta\n /\nexport interface RichTextSendBoxStrings extends SendBoxStrings {\n /\n Tooltip text for the bold button.\n /\n boldTooltip: string;\n /\n Tooltip text for the italic button.\n /\n italicTooltip: string;\n /\n Tooltip text for the underline button.\n /\n underlineTooltip: string;\n /\n Tooltip text for the bullet list button.\n /\n bulletListTooltip: string;\n /\n Tooltip text for the number list button.\n /\n numberListTooltip: string;\n /\n Tooltip text for the increase indent button.\n /\n increaseIndentTooltip: string;\n /\n Tooltip text for the decrease indent button.\n /\n decreaseIndentTooltip: string;\n /\n Tooltip text insert table button.\n /\n insertTableTooltip: string;\n /\n Tooltip text for the rich text format button button.\n /\n richTextFormatButtonTooltip: string;\n /\n Text for the insert menu item.\n /\n insertRowOrColumnMenu: string;\n /\n Title for the insert table menu.\n /\n insertTableMenuTitle: string;\n /\n Text for the insert menu item to insert row above the current selection.\n /\n insertRowAboveMenu: string;\n /\n Text for the insert menu item to insert row below the current selection.\n /\n insertRowBelowMenu: string;\n /\n Text for the insert menu item to insert column to the left from the current selection.\n /\n insertColumnLeftMenu: string;\n /\n Text for the insert menu item to insert column to the right from the current selection.\n /\n insertColumnRightMenu: string;\n /\n Text for the delete row or column menu.\n /\n deleteRowOrColumnMenu: string;\n /\n Text for the delete column menu.\n /\n deleteColumnMenu: string;\n /\n Text for the delete row menu.\n /\n deleteRowMenu: string;\n /\n Text for the delete table menu.\n /\n deleteTableMenu: string;\n}\n\n/\n Props for {@link RichTextSendBox}.\n \n @beta\n /\nexport interface RichTextSendBoxProps {\n /\n Optional boolean to disable text box\n * @defaultValue false\n /\n disabled?: boolean;\n /\n Optional strings to override in component\n /\n strings?: Partial<RichTextSendBoxStrings>;\n /\n Optional text for system message above the text box\n /\n systemMessage?: string;\n / @conditional-compile-remove(attachment-upload) /\n /\n Optional array of active attachment uploads where each object has attributes\n * of a attachment upload like name, progress, errorMessage etc.\n * @beta\n /\n activeAttachmentUploads?: AttachmentMetadata[];\n / @conditional-compile-remove(attachment-upload) /\n /\n Optional callback to remove the attachment upload before sending by clicking on\n * cancel icon.\n * @beta\n /\n onCancelAttachmentUpload?: (attachmentId: string) => void;\n /\n Callback function used when the send button is clicked.\n /\n onSendMessage: (content: string) => Promise<void>;\n}\n\n/\n A component to render SendBox with Rich Text Editor support.\n \n @beta\n /\nexport const RichTextSendBox = (props: RichTextSendBoxProps): JSX.Element => {\n const {\n disabled = false,\n systemMessage,\n onSendMessage,\n / @conditional-compile-remove(attachment-upload) /\n activeAttachmentUploads,\n / @conditional-compile-remove(attachment-upload) /\n onCancelAttachmentUpload\n } = props;\n\n const theme = useTheme();\n const locale = useLocale();\n\n const localeStrings = useMemo(() => {\n / @conditional-compile-remove(rich-text-editor) /\n return locale.strings.richTextSendBox;\n return locale.strings.sendBox;\n }, [/ @conditional-compile-remove(rich-text-editor) / locale.strings.richTextSendBox, locale.strings.sendBox]);\n\n const strings = useMemo(() => {\n return { ...localeStrings, ...props.strings };\n }, [localeStrings, props.strings]);\n\n const [contentValue, setContentValue] = useState('');\n const [contentValueOverflow, setContentValueOverflow] = useState(false);\n / @conditional-compile-remove(attachment-upload) /\n const [attachmentUploadsPendingError, setAttachmentUploadsPendingError] = useState<SendBoxErrorBarError \| undefined>(\n undefined\n );\n const editorComponentRef = useRef<RichTextEditorComponentRef>(null);\n\n const contentTooLongMessage = useMemo(\n () => (contentValueOverflow ? strings.textTooLong : undefined),\n [contentValueOverflow, strings.textTooLong]\n );\n\n const setContent = useCallback((newValue?: string): void => {\n if (newValue === undefined) {\n return;\n }\n\n setContentValueOverflow(isMessageTooLong(newValue.length));\n setContentValue(newValue);\n }, []);\n\n const sendMessageOnClick = useCallback((): void => {\n if (disabled \|\| contentValueOverflow) {\n return;\n }\n // Don't send message until all attachments have been uploaded successfully\n / @conditional-compile-remove(attachment-upload) /\n setAttachmentUploadsPendingError(undefined);\n\n / @conditional-compile-remove(attachment-upload) /\n if (hasIncompleteAttachmentUploads(activeAttachmentUploads)) {\n setAttachmentUploadsPendingError({ message: strings.attachmentUploadsPendingError, timestamp: Date.now() });\n return;\n }\n\n const message = contentValue;\n // we don't want to send empty messages including spaces, newlines, tabs\n // Message can be empty if there is a valid attachment upload\n if (\n sanitizeText(message).length > 0 \|\|\n / @conditional-compile-remove(attachment-upload) / hasCompletedAttachmentUploads(activeAttachmentUploads)\n ) {\n onSendMessage(message);\n setContentValue('');\n editorComponentRef.current?.setEmptyContent();\n }\n editorComponentRef.current?.focus();\n }, [\n contentValue,\n contentValueOverflow,\n disabled,\n onSendMessage,\n / @conditional-compile-remove(attachment-upload) / activeAttachmentUploads,\n / @conditional-compile-remove(attachment-upload) / strings.attachmentUploadsPendingError\n ]);\n\n const hasErrorMessage = useMemo(() => {\n return (\n !!systemMessage \|\|\n !!contentTooLongMessage \|\|\n / @conditional-compile-remove(attachment-upload) /\n !!attachmentUploadsPendingError \|\|\n / @conditional-compile-remove(attachment-upload) /\n !!activeAttachmentUploads?.filter((attachmentUpload) => attachmentUpload.uploadError).pop()?.uploadError\n );\n }, [\n / @conditional-compile-remove(attachment-upload) /\n activeAttachmentUploads,\n contentTooLongMessage,\n / @conditional-compile-remove(attachment-upload) /\n attachmentUploadsPendingError,\n systemMessage\n ]);\n\n const onRenderSendIcon = useCallback(\n (isHover: boolean) => (\n <Icon\n iconName={isHover && contentValue ? 'SendBoxSendHovered' : 'SendBoxSend'}\n className={sendIconStyle({\n theme,\n hasText: !!contentValue,\n / @conditional-compile-remove(attachment-upload) /\n hasAttachment: false,\n hasErrorMessage: hasErrorMessage,\n defaultTextColor: theme.palette.neutralSecondary,\n disabled: disabled\n })}\n />\n ),\n [contentValue, disabled, hasErrorMessage, theme]\n );\n\n const sendBoxErrorsProps: RichTextSendBoxErrorsProps = useMemo(() => {\n return {\n / @conditional-compile-remove(attachment-upload) /\n attachmentUploadsPendingError: attachmentUploadsPendingError,\n / @conditional-compile-remove(attachment-upload) /\n attachmentUploadError: activeAttachmentUploads?.filter((attachmentUpload) => attachmentUpload.uploadError).pop()\n ?.uploadError,\n systemMessage: systemMessage,\n textTooLongMessage: contentTooLongMessage\n };\n }, [\n / @conditional-compile-remove(attachment-upload) /\n activeAttachmentUploads,\n contentTooLongMessage,\n / @conditional-compile-remove(attachment-upload) /\n attachmentUploadsPendingError,\n systemMessage\n ]);\n\n / @conditional-compile-remove(attachment-upload) /\n const onRenderAttachmentUploads = useCallback(() => {\n return (\n <Stack className={attachmentUploadCardsStyles}>\n <FluentV9ThemeProvider v8Theme={theme}>\n <_AttachmentUploadCards\n activeAttachmentUploads={activeAttachmentUploads}\n onCancelAttachmentUpload={onCancelAttachmentUpload}\n strings={{\n removeAttachment: strings.removeAttachment,\n uploading: strings.uploading,\n uploadCompleted: strings.uploadCompleted\n }}\n />\n </FluentV9ThemeProvider>\n </Stack>\n );\n }, [\n activeAttachmentUploads,\n onCancelAttachmentUpload,\n strings.removeAttachment,\n strings.uploadCompleted,\n strings.uploading,\n theme\n ]);\n\n const sendButton = useMemo(() => {\n return (\n <InputBoxButton\n onRenderIcon={onRenderSendIcon}\n onClick={(e) => {\n sendMessageOnClick();\n e.stopPropagation(); // Prevents the click from bubbling up and triggering a focus event on the chat.\n }}\n className={richTextActionButtonsStyle}\n ariaLabel={localeStrings.sendButtonAriaLabel}\n tooltipContent={localeStrings.sendButtonAriaLabel}\n />\n );\n }, [localeStrings.sendButtonAriaLabel, onRenderSendIcon, sendMessageOnClick]);\n\n / @conditional-compile-remove(attachment-upload) /\n const hasAttachmentUploads = useMemo(() => {\n return (\n hasCompletedAttachmentUploads(activeAttachmentUploads) \|\| hasIncompleteAttachmentUploads(activeAttachmentUploads)\n );\n }, [activeAttachmentUploads]);\n\n return (\n <Stack>\n <RichTextSendBoxErrors {...sendBoxErrorsProps} />\n <RichTextInputBoxComponent\n placeholderText={strings.placeholderText}\n onChange={setContent}\n onEnterKeyDown={sendMessageOnClick}\n editorComponentRef={editorComponentRef}\n strings={strings}\n disabled={disabled}\n actionComponents={sendButton}\n richTextEditorStyleProps={sendBoxRichTextEditorStyle}\n / @conditional-compile-remove(attachment-upload) /\n onRenderAttachmentUploads={onRenderAttachmentUploads}\n / @conditional-compile-remove(attachment-upload) */\n hasAttachments={hasAttachmentUploads}\n />\n </Stack>\n );\n};\n"]}

package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextSendBoxErrors.js CHANGED Viewed

@@ -7,9 +7,9 @@ import { SendBoxErrorBar } from '../SendBoxErrorBar';
  */
 export const RichTextSendBoxErrors = (props) => {
     const {
-    /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+    /* @conditional-compile-remove(attachment-upload) */
     attachmentUploadError,
-    /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+    /* @conditional-compile-remove(attachment-upload) */
     attachmentUploadsPendingError, systemMessage, textTooLongMessage } = props;
     const [sendBoxError, setSendBoxError] = useState(undefined);
     useEffect(() => {
@@ -34,11 +34,11 @@ export const RichTextSendBoxErrors = (props) => {
             if (prev) {
                 errors.push(prev);
             }
-            /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+            /* @conditional-compile-remove(attachment-upload) */
             if (attachmentUploadsPendingError) {
                 errors.push(attachmentUploadsPendingError);
             }
-            /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+            /* @conditional-compile-remove(attachment-upload) */
             if (attachmentUploadError) {
                 errors.push(attachmentUploadError);
             }
@@ -50,8 +50,8 @@ export const RichTextSendBoxErrors = (props) => {
             return sortedErrors[0];
         });
     }, [
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */ attachmentUploadError,
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */ attachmentUploadsPendingError
+        /* @conditional-compile-remove(attachment-upload) */ attachmentUploadError,
+        /* @conditional-compile-remove(attachment-upload) */ attachmentUploadsPendingError
     ]);
     const onDismiss = useCallback(() => {
         if (systemMessage && !isMessageEmpty(systemMessage)) {

package/dist/dist-esm/react-components/src/components/RichTextEditor/RichTextSendBoxErrors.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RichTextSendBoxErrors.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/RichTextEditor/RichTextSendBoxErrors.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,eAAe,EAAwB,MAAM,oBAAoB,CAAC;AAc3E;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,KAAiC,EAAe,EAAE;IACtF,MAAM;IACJ,~~qGAAqG~~;~~IACrG~~,qBAAqB;IACrB,~~qGAAqG~~;~~IACrG~~,6BAA6B,EAC7B,aAAa,EACb,kBAAkB,EACnB,GAAG,KAAK,CAAC;IACV,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAmC,SAAS,CAAC,CAAC;IAE9F,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,aAAa,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,EAAE,CAAC;YACpD,eAAe,CAAC,EAAE,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;QACrE,CAAC;IACH,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,kBAAkB,IAAI,CAAC,cAAc,CAAC,kBAAkB,CAAC,EAAE,CAAC;YAC9D,eAAe,CAAC,EAAE,OAAO,EAAE,kBAAkB,EAAE,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;QAC1E,CAAC;IACH,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC;IAEzB,SAAS,CAAC,GAAG,EAAE;QACb,IACE,CAAC,kBAAkB,KAAK,SAAS,IAAI,cAAc,CAAC,kBAAkB,CAAC,CAAC;YACxE,CAAC,aAAa,KAAK,SAAS,IAAI,cAAc,CAAC,aAAa,CAAC,CAAC,EAC9D,CAAC;YACD,eAAe,CAAC,SAAS,CAAC,CAAC;QAC7B,CAAC;IACH,CAAC,EAAE,CAAC,aAAa,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAExC,SAAS,CAAC,GAAG,EAAE;QACb,eAAe,CAAC,CAAC,IAAI,EAAE,EAAE;YACvB,MAAM,MAAM,GAA2B,EAAE,CAAC;YAC1C,IAAI,IAAI,EAAE,CAAC;gBACT,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YACpB,CAAC;YACD,~~qGAAqG~~;~~YACrG~~,IAAI,6BAA6B,EAAE,CAAC;gBAClC,MAAM,CAAC,IAAI,CAAC,6BAA6B,CAAC,CAAC;YAC7C,CAAC;YACD,~~qGAAqG~~;~~YACrG~~,IAAI,qBAAqB,EAAE,CAAC;gBAC1B,MAAM,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;YACrC,CAAC;YACD,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;gBACxB,OAAO,SAAS,CAAC;YACnB,CAAC;YACD,+BAA+B;YAC/B,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,GAAG,CAAC,CAAC,SAAS,CAAC,CAAC;YACtE,OAAO,YAAY,CAAC,CAAC,CAAC,CAAC;QACzB,CAAC,CAAC,CAAC;IACL,CAAC,EAAE;QACD,~~qGAAqG~~,CAAC,qBAAqB;~~QAC3H~~,~~qGAAqG~~,CAAC,6BAA6B;~~KACpI~~,CAAC,CAAC;IAEH,MAAM,SAAS,GAAG,WAAW,CAAC,GAAG,EAAE;QACjC,IAAI,aAAa,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,EAAE,CAAC;YACpD,eAAe,CAAC,EAAE,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;QACrE,CAAC;IACH,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,OAAO,CACL,oBAAC,eAAe,IACd,KAAK,EAAE,YAAY,EACnB,cAAc;QACZ,mCAAmC;QACnC,aAAa,KAAK,SAAS,IAAI,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,MAAK,aAAa,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,CAAC,CAAC,SAAS,EAEhG,SAAS,EAAE,SAAS,GACpB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,cAAc,GAAG,CAAC,OAAe,EAAW,EAAE;IAClD,OAAO,OAAO,CAAC,IAAI,EAAE,CAAC,MAAM,KAAK,CAAC,CAAC;AACrC,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useCallback, useEffect, useState } from 'react';\nimport { SendBoxErrorBar, SendBoxErrorBarError } from '../SendBoxErrorBar';\n\n/*\n @private\n /\nexport interface RichTextSendBoxErrorsProps {\n / @conditional-compile-remove(attachment-~~download) @conditional-compile-remove(attachment-~~upload) /\n attachmentUploadsPendingError?: SendBoxErrorBarError;\n / @conditional-compile-remove(attachment-~~download) @conditional-compile-remove(attachment-~~upload) /\n attachmentUploadError?: SendBoxErrorBarError;\n systemMessage?: string;\n textTooLongMessage?: string;\n}\n\n/\n @private\n /\nexport const RichTextSendBoxErrors = (props: RichTextSendBoxErrorsProps): JSX.Element => {\n const {\n / @conditional-compile-remove(attachment-~~download) @conditional-compile-remove(attachment-~~upload) /\n attachmentUploadError,\n / @conditional-compile-remove(attachment-~~download) @conditional-compile-remove(attachment-~~upload) /\n attachmentUploadsPendingError,\n systemMessage,\n textTooLongMessage\n } = props;\n const [sendBoxError, setSendBoxError] = useState<SendBoxErrorBarError \| undefined>(undefined);\n\n useEffect(() => {\n if (systemMessage && !isMessageEmpty(systemMessage)) {\n setSendBoxError({ message: systemMessage, timestamp: Date.now() });\n }\n }, [systemMessage]);\n\n useEffect(() => {\n if (textTooLongMessage && !isMessageEmpty(textTooLongMessage)) {\n setSendBoxError({ message: textTooLongMessage, timestamp: Date.now() });\n }\n }, [textTooLongMessage]);\n\n useEffect(() => {\n if (\n (textTooLongMessage === undefined \|\| isMessageEmpty(textTooLongMessage)) &&\n (systemMessage === undefined \|\| isMessageEmpty(systemMessage))\n ) {\n setSendBoxError(undefined);\n }\n }, [systemMessage, textTooLongMessage]);\n\n useEffect(() => {\n setSendBoxError((prev) => {\n const errors: SendBoxErrorBarError[] = [];\n if (prev) {\n errors.push(prev);\n }\n / @conditional-compile-remove(attachment-~~download) @conditional-compile-remove(attachment-~~upload) /\n if (attachmentUploadsPendingError) {\n errors.push(attachmentUploadsPendingError);\n }\n / @conditional-compile-remove(attachment-~~download) @conditional-compile-remove(attachment-~~upload) /\n if (attachmentUploadError) {\n errors.push(attachmentUploadError);\n }\n if (errors.length === 0) {\n return undefined;\n }\n // sort to get the latest error\n const sortedErrors = errors.sort((a, b) => b.timestamp - a.timestamp);\n return sortedErrors[0];\n });\n }, [\n / @conditional-compile-remove(attachment-~~download) @conditional-compile-remove(attachment-~~upload) / attachmentUploadError,\n / @conditional-compile-remove(attachment-~~download) @conditional-compile-remove(attachment-~~upload) / attachmentUploadsPendingError\n ]);\n\n const onDismiss = useCallback(() => {\n if (systemMessage && !isMessageEmpty(systemMessage)) {\n setSendBoxError({ message: systemMessage, timestamp: Date.now() });\n }\n }, [systemMessage]);\n\n return (\n <SendBoxErrorBar\n error={sendBoxError}\n dismissAfterMs={\n // don't dismiss the system message\n systemMessage !== undefined && sendBoxError?.message !== systemMessage ? 10 1000 : undefined\n }\n onDismiss={onDismiss}\n />\n );\n};\n\nconst isMessageEmpty = (message: string): boolean => {\n return message.trim().length === 0;\n};\n"]}
1	+ {"version":3,"file":"RichTextSendBoxErrors.js","sourceRoot":"","sources":["../../../../../../../react-components/src/components/RichTextEditor/RichTextSendBoxErrors.tsx"],"names":[],"mappings":"AAAA,uCAAuC;AACvC,kCAAkC;AAElC,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,eAAe,EAAwB,MAAM,oBAAoB,CAAC;AAc3E;;GAEG;AACH,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,KAAiC,EAAe,EAAE;IACtF,MAAM;IACJ,oDAAoD;IACpD,qBAAqB;IACrB,oDAAoD;IACpD,6BAA6B,EAC7B,aAAa,EACb,kBAAkB,EACnB,GAAG,KAAK,CAAC;IACV,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAmC,SAAS,CAAC,CAAC;IAE9F,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,aAAa,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,EAAE,CAAC;YACpD,eAAe,CAAC,EAAE,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;QACrE,CAAC;IACH,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,kBAAkB,IAAI,CAAC,cAAc,CAAC,kBAAkB,CAAC,EAAE,CAAC;YAC9D,eAAe,CAAC,EAAE,OAAO,EAAE,kBAAkB,EAAE,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;QAC1E,CAAC;IACH,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC;IAEzB,SAAS,CAAC,GAAG,EAAE;QACb,IACE,CAAC,kBAAkB,KAAK,SAAS,IAAI,cAAc,CAAC,kBAAkB,CAAC,CAAC;YACxE,CAAC,aAAa,KAAK,SAAS,IAAI,cAAc,CAAC,aAAa,CAAC,CAAC,EAC9D,CAAC;YACD,eAAe,CAAC,SAAS,CAAC,CAAC;QAC7B,CAAC;IACH,CAAC,EAAE,CAAC,aAAa,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAExC,SAAS,CAAC,GAAG,EAAE;QACb,eAAe,CAAC,CAAC,IAAI,EAAE,EAAE;YACvB,MAAM,MAAM,GAA2B,EAAE,CAAC;YAC1C,IAAI,IAAI,EAAE,CAAC;gBACT,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YACpB,CAAC;YACD,oDAAoD;YACpD,IAAI,6BAA6B,EAAE,CAAC;gBAClC,MAAM,CAAC,IAAI,CAAC,6BAA6B,CAAC,CAAC;YAC7C,CAAC;YACD,oDAAoD;YACpD,IAAI,qBAAqB,EAAE,CAAC;gBAC1B,MAAM,CAAC,IAAI,CAAC,qBAAqB,CAAC,CAAC;YACrC,CAAC;YACD,IAAI,MAAM,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;gBACxB,OAAO,SAAS,CAAC;YACnB,CAAC;YACD,+BAA+B;YAC/B,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,GAAG,CAAC,CAAC,SAAS,CAAC,CAAC;YACtE,OAAO,YAAY,CAAC,CAAC,CAAC,CAAC;QACzB,CAAC,CAAC,CAAC;IACL,CAAC,EAAE;QACD,oDAAoD,CAAC,qBAAqB;QAC1E,oDAAoD,CAAC,6BAA6B;KACnF,CAAC,CAAC;IAEH,MAAM,SAAS,GAAG,WAAW,CAAC,GAAG,EAAE;QACjC,IAAI,aAAa,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC,EAAE,CAAC;YACpD,eAAe,CAAC,EAAE,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;QACrE,CAAC;IACH,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,OAAO,CACL,oBAAC,eAAe,IACd,KAAK,EAAE,YAAY,EACnB,cAAc;QACZ,mCAAmC;QACnC,aAAa,KAAK,SAAS,IAAI,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,MAAK,aAAa,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,CAAC,CAAC,SAAS,EAEhG,SAAS,EAAE,SAAS,GACpB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,cAAc,GAAG,CAAC,OAAe,EAAW,EAAE;IAClD,OAAO,OAAO,CAAC,IAAI,EAAE,CAAC,MAAM,KAAK,CAAC,CAAC;AACrC,CAAC,CAAC","sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\nimport React, { useCallback, useEffect, useState } from 'react';\nimport { SendBoxErrorBar, SendBoxErrorBarError } from '../SendBoxErrorBar';\n\n/*\n @private\n /\nexport interface RichTextSendBoxErrorsProps {\n / @conditional-compile-remove(attachment-upload) /\n attachmentUploadsPendingError?: SendBoxErrorBarError;\n / @conditional-compile-remove(attachment-upload) /\n attachmentUploadError?: SendBoxErrorBarError;\n systemMessage?: string;\n textTooLongMessage?: string;\n}\n\n/\n @private\n /\nexport const RichTextSendBoxErrors = (props: RichTextSendBoxErrorsProps): JSX.Element => {\n const {\n / @conditional-compile-remove(attachment-upload) /\n attachmentUploadError,\n / @conditional-compile-remove(attachment-upload) /\n attachmentUploadsPendingError,\n systemMessage,\n textTooLongMessage\n } = props;\n const [sendBoxError, setSendBoxError] = useState<SendBoxErrorBarError \| undefined>(undefined);\n\n useEffect(() => {\n if (systemMessage && !isMessageEmpty(systemMessage)) {\n setSendBoxError({ message: systemMessage, timestamp: Date.now() });\n }\n }, [systemMessage]);\n\n useEffect(() => {\n if (textTooLongMessage && !isMessageEmpty(textTooLongMessage)) {\n setSendBoxError({ message: textTooLongMessage, timestamp: Date.now() });\n }\n }, [textTooLongMessage]);\n\n useEffect(() => {\n if (\n (textTooLongMessage === undefined \|\| isMessageEmpty(textTooLongMessage)) &&\n (systemMessage === undefined \|\| isMessageEmpty(systemMessage))\n ) {\n setSendBoxError(undefined);\n }\n }, [systemMessage, textTooLongMessage]);\n\n useEffect(() => {\n setSendBoxError((prev) => {\n const errors: SendBoxErrorBarError[] = [];\n if (prev) {\n errors.push(prev);\n }\n / @conditional-compile-remove(attachment-upload) /\n if (attachmentUploadsPendingError) {\n errors.push(attachmentUploadsPendingError);\n }\n / @conditional-compile-remove(attachment-upload) /\n if (attachmentUploadError) {\n errors.push(attachmentUploadError);\n }\n if (errors.length === 0) {\n return undefined;\n }\n // sort to get the latest error\n const sortedErrors = errors.sort((a, b) => b.timestamp - a.timestamp);\n return sortedErrors[0];\n });\n }, [\n / @conditional-compile-remove(attachment-upload) / attachmentUploadError,\n / @conditional-compile-remove(attachment-upload) / attachmentUploadsPendingError\n ]);\n\n const onDismiss = useCallback(() => {\n if (systemMessage && !isMessageEmpty(systemMessage)) {\n setSendBoxError({ message: systemMessage, timestamp: Date.now() });\n }\n }, [systemMessage]);\n\n return (\n <SendBoxErrorBar\n error={sendBoxError}\n dismissAfterMs={\n // don't dismiss the system message\n systemMessage !== undefined && sendBoxError?.message !== systemMessage ? 10 1000 : undefined\n }\n onDismiss={onDismiss}\n />\n );\n};\n\nconst isMessageEmpty = (message: string): boolean => {\n return message.trim().length === 0;\n};\n"]}

package/dist/dist-esm/react-components/src/components/SendBox.js CHANGED Viewed

@@ -8,16 +8,16 @@ import { useLocale } from '../localization';
 import { useIdentifiers } from '../identifiers';
 import { InputBoxComponent } from './InputBoxComponent';
 import { InputBoxButton } from './InputBoxButton';
-/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+/* @conditional-compile-remove(attachment-upload) */
 import { SendBoxErrors } from './SendBoxErrors';
-/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+/* @conditional-compile-remove(attachment-upload) */
 import { _AttachmentUploadCards } from './AttachmentUploadCards';
-/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+/* @conditional-compile-remove(attachment-upload) */
 import { attachmentUploadCardsStyles } from './styles/SendBox.styles';
-/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+/* @conditional-compile-remove(attachment-upload) */
 import { hasCompletedAttachmentUploads, hasIncompleteAttachmentUploads } from './utils/SendBoxUtils';
 import { MAXIMUM_LENGTH_OF_MESSAGE, isMessageTooLong, sanitizeText } from './utils/SendBoxUtils';
-/* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+/* @conditional-compile-remove(attachment-upload) */
 import { FluentV9ThemeProvider } from '../theming/FluentV9ThemeProvider';
 /**
  * Component for typing and sending messages.
@@ -31,7 +31,7 @@ export const SendBox = (props) => {
     const { disabled, systemMessage, supportNewline, onSendMessage, onTyping, onRenderIcon, onRenderSystemMessage, styles, autoFocus,
     /* @conditional-compile-remove(mention) */
     mentionLookupOptions,
-    /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+    /* @conditional-compile-remove(attachment-upload) */
     activeAttachmentUploads } = props;
     const theme = useTheme();
     const localeStrings = useLocale().strings.sendBox;
@@ -40,7 +40,7 @@ export const SendBox = (props) => {
     const [textValue, setTextValue] = useState('');
     const [textValueOverflow, setTextValueOverflow] = useState(false);
     const sendTextFieldRef = React.useRef(null);
-    /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+    /* @conditional-compile-remove(attachment-upload) */
     const [attachmentUploadsPendingError, setAttachmentUploadsPendingError] = useState(undefined);
     const sendMessageOnClick = () => {
         var _a;
@@ -49,9 +49,9 @@ export const SendBox = (props) => {
             return;
         }
         // Don't send message until all attachments have been uploaded successfully
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+        /* @conditional-compile-remove(attachment-upload) */
         setAttachmentUploadsPendingError(undefined);
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+        /* @conditional-compile-remove(attachment-upload) */
         if (hasIncompleteAttachmentUploads(activeAttachmentUploads)) {
             setAttachmentUploadsPendingError({ message: strings.attachmentUploadsPendingError, timestamp: Date.now() });
             return;
@@ -60,7 +60,7 @@ export const SendBox = (props) => {
         // we don't want to send empty messages including spaces, newlines, tabs
         // Message can be empty if there is a valid attachment upload
         if (sanitizeText(message).length > 0 ||
-            /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */ hasCompletedAttachmentUploads(activeAttachmentUploads)) {
+            /* @conditional-compile-remove(attachment-upload) */ hasCompletedAttachmentUploads(activeAttachmentUploads)) {
             onSendMessage && onSendMessage(message);
             setTextValue('');
         }
@@ -80,25 +80,25 @@ export const SendBox = (props) => {
     const mergedSendIconStyle = useMemo(() => sendIconStyle({
         theme,
         hasText: !!textValue,
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */ hasAttachment: hasCompletedAttachmentUploads(activeAttachmentUploads),
+        /* @conditional-compile-remove(attachment-upload) */ hasAttachment: hasCompletedAttachmentUploads(activeAttachmentUploads),
         hasErrorMessage: !!errorMessage,
         customSendIconStyle: styles === null || styles === void 0 ? void 0 : styles.sendMessageIcon
     }), [
         theme,
         textValue,
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */ activeAttachmentUploads,
+        /* @conditional-compile-remove(attachment-upload) */ activeAttachmentUploads,
         errorMessage,
         styles === null || styles === void 0 ? void 0 : styles.sendMessageIcon
     ]);
     const onRenderSendIcon = useCallback((isHover) => onRenderIcon ? (onRenderIcon(isHover)) : (React.createElement(Icon, { iconName: isHover && textValue ? 'SendBoxSendHovered' : 'SendBoxSend', className: mergedSendIconStyle })), [mergedSendIconStyle, onRenderIcon, textValue]);
     // Ensure that errors are cleared when there are no attachments in sendBox
-    /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+    /* @conditional-compile-remove(attachment-upload) */
     React.useEffect(() => {
         if (!(activeAttachmentUploads === null || activeAttachmentUploads === void 0 ? void 0 : activeAttachmentUploads.filter((upload) => !upload.uploadError).length)) {
             setAttachmentUploadsPendingError(undefined);
         }
     }, [activeAttachmentUploads]);
-    /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+    /* @conditional-compile-remove(attachment-upload) */
     const sendBoxErrorsProps = useMemo(() => {
         var _a;
         return {
@@ -106,7 +106,7 @@ export const SendBox = (props) => {
             attachmentUploadError: (_a = activeAttachmentUploads === null || activeAttachmentUploads === void 0 ? void 0 : activeAttachmentUploads.filter((attachmentUpload) => attachmentUpload.uploadError).pop()) === null || _a === void 0 ? void 0 : _a.uploadError
         };
     }, [activeAttachmentUploads, attachmentUploadsPendingError]);
-    /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+    /* @conditional-compile-remove(attachment-upload) */
     const onRenderAttachmentUploads = useCallback(() => {
         var _a, _b, _c, _d, _e, _f;
         if (!(activeAttachmentUploads === null || activeAttachmentUploads === void 0 ? void 0 : activeAttachmentUploads.filter((upload) => !upload.uploadError).length)) {
@@ -128,8 +128,8 @@ export const SendBox = (props) => {
         localeStrings.uploadCompleted
     ]);
     return (React.createElement(Stack, { className: mergeStyles(sendBoxWrapperStyles, { overflow: 'visible' } // This is needed for the mention popup to be visible
-        ) },
-        /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */ React.createElement(SendBoxErrors, Object.assign({}, sendBoxErrorsProps)),
+        ) }, /* @conditional-compile-remove(attachment-upload) */
+        React.createElement(SendBoxErrors, Object.assign({}, sendBoxErrorsProps)),
         React.createElement(Stack, { className: borderAndBoxShadowStyle({
                 theme,
                 hasErrorMessage: !!errorMessage,
@@ -151,7 +151,7 @@ export const SendBox = (props) => {
                         }
                         e.stopPropagation();
                     }, id: 'sendIconWrapper', className: mergedSendButtonStyle, ariaLabel: localeStrings.sendButtonAriaLabel, tooltipContent: localeStrings.sendButtonAriaLabel })),
-            /* @conditional-compile-remove(attachment-download) @conditional-compile-remove(attachment-upload) */
+            /* @conditional-compile-remove(attachment-upload) */
             onRenderAttachmentUploads())));
 };
 //# sourceMappingURL=SendBox.js.map