imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add basic plain text editor

Browse source
This commit is contained in:
Florian Duros 2022-10-25 17:26:14 +02:00
parent 6e73a853a8
commit 50279c8870
No known key found for this signature in database
GPG key ID: 9700AA5870258A0B
18 changed files with 316 additions and 62 deletions
Download patch file Download diff file Expand all files Collapse all files

35
src/components/views/rooms/wysiwyg_composer/SendWysiwygComposer.tsx
View file

@ -15,32 +15,37 @@ limitations under the License.
*/
import React, { forwardRef, RefObject } from 'react';
import { FormattingFunctions } from '@matrix-org/matrix-wysiwyg';
import { useWysiwygSendActionHandler } from './hooks/useWysiwygSendActionHandler';
import { WysiwygComposer } from './components/WysiwygComposer';
import { PlainTextComposer } from './components/PlainTextComposer';
import { ComposerFunctions } from './types';
interface SendWysiwygComposerProps {
disabled?: boolean;
onChange: (content: string) => void;
onSend: () => void;
}
interface ContentProps {
disabled: boolean;
formattingFunctions: FormattingFunctions;
composerFunctions: ComposerFunctions;
}
const Content = forwardRef<HTMLElement, ContentProps>(
function Content({ disabled, formattingFunctions: wysiwyg }: ContentProps, forwardRef: RefObject<HTMLElement>) {
useWysiwygSendActionHandler(disabled, forwardRef, wysiwyg);
function Content({ disabled, composerFunctions }: ContentProps, forwardRef: RefObject<HTMLElement>) {
useWysiwygSendActionHandler(disabled, forwardRef, composerFunctions);
return null;
},
);
export function SendWysiwygComposer(props: SendWysiwygComposerProps) {
return (
<WysiwygComposer className="mx_SendWysiwygComposer" {...props}>{ (ref, wysiwyg) => (
<Content disabled={props.disabled} ref={ref} formattingFunctions={wysiwyg} />
) }
</WysiwygComposer>);
interface SendWysiwygComposerProps {
isRichTextEnabled: boolean;
disabled?: boolean;
onChange: (content: string) => void;
onSend: () => void;
}
export function SendWysiwygComposer({ isRichTextEnabled, ...props }: SendWysiwygComposerProps) {
const Composer = isRichTextEnabled ? WysiwygComposer : PlainTextComposer;
return <Composer className="mx_SendWysiwygComposer" {...props}>
{ (ref, composerFunctions) => (
<Content disabled={props.disabled} ref={ref} composerFunctions={composerFunctions} />
) }
</Composer>;
}