moon
/
soapbox
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Lexical: Improve image node insertion 

Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
This commit is contained in:
marcin mikołajczak 2023-08-01 14:44:12 +02:00
parent 43216e7d2a
commit 942f22d5a3
2 changed files with 11 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/soapbox/features/compose/editor/index.tsx
View File

@ -156,8 +156,8 @@ const ComposeEditor = React.forwardRef<string, IComposeEditor>(({
<div className='editor' ref={onRef} onFocus={onFocus} onPaste={handlePaste}>
<ContentEditable
className={clsx('outline-none transition-[min-height] motion-reduce:transition-none', {
'min-h-[40px] pb-4': condensed,
'min-h-[100px] pb-8': !condensed,
'min-h-[40px]': condensed,
'min-h-[100px]': !condensed,
})}
/>
</div>

12
app/soapbox/features/compose/editor/plugins/floating-block-type-toolbar-plugin.tsx
View File

@ -6,10 +6,13 @@
import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
import { $createHorizontalRuleNode } from '@lexical/react/LexicalHorizontalRuleNode';
import { mergeRegister } from '@lexical/utils';
import { $wrapNodeInElement, mergeRegister } from '@lexical/utils';
import {
$createParagraphNode,
$getSelection,
$insertNodes,
$isRangeSelection,
$isRootOrShadowRoot,
COMMAND_PRIORITY_LOW,
DEPRECATED_$isGridSelection,
LexicalEditor,
@ -181,8 +184,11 @@ const BlockTypeFloatingToolbar = ({
editor.update(() => {
const selection = $getSelection();
if ($isRangeSelection(selection) || DEPRECATED_$isGridSelection(selection)) {
const selectionNode = selection.anchor.getNode();
selectionNode.replace($createImageNode({ altText: '', src }));
const imageNode = $createImageNode({ altText: '', src });
$insertNodes([imageNode]);
if ($isRootOrShadowRoot(imageNode.getParentOrThrow())) {
$wrapNodeInElement(imageNode, $createParagraphNode).selectEnd();
}
}
});
};