fix(whiteboard): error when drag away last element in Chrome
This commit is contained in:
@@ -1,7 +1,6 @@
|
||||
import { styled } from '@toeverything/components/ui';
|
||||
import { FC, useLayoutEffect, useMemo, useRef } from 'react';
|
||||
import { useCallback, useMemo } from 'react';
|
||||
|
||||
// import { RenderChildren } from './RenderChildren';
|
||||
import { useEditor } from '../Contexts';
|
||||
import { useBlock } from '../hooks';
|
||||
|
||||
@@ -10,19 +9,21 @@ interface RenderBlockProps {
|
||||
hasContainer?: boolean;
|
||||
}
|
||||
|
||||
export const RenderBlock = ({
|
||||
export function RenderBlock({
|
||||
blockId,
|
||||
hasContainer = true,
|
||||
}: RenderBlockProps) => {
|
||||
}: RenderBlockProps) {
|
||||
const { editor, editorElement } = useEditor();
|
||||
const { block } = useBlock(blockId);
|
||||
const blockRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
if (block && blockRef.current) {
|
||||
block.dom = blockRef.current;
|
||||
}
|
||||
});
|
||||
const setRef = useCallback(
|
||||
(dom: HTMLElement) => {
|
||||
if (block != null && dom != null) {
|
||||
block.dom = dom;
|
||||
}
|
||||
},
|
||||
[block]
|
||||
);
|
||||
|
||||
const blockView = useMemo(() => {
|
||||
if (block?.type) {
|
||||
@@ -54,17 +55,13 @@ export const RenderBlock = ({
|
||||
) : null;
|
||||
|
||||
return hasContainer ? (
|
||||
<BlockContainer
|
||||
block-id={blockId}
|
||||
ref={blockRef}
|
||||
data-block-id={blockId}
|
||||
>
|
||||
<BlockContainer block-id={blockId} ref={setRef} data-block-id={blockId}>
|
||||
{view}
|
||||
</BlockContainer>
|
||||
) : (
|
||||
<> {view}</>
|
||||
);
|
||||
};
|
||||
}
|
||||
|
||||
const BlockContainer = styled('div')(({ theme }) => ({
|
||||
fontSize: theme.typography.body1.fontSize,
|
||||
|
||||
Reference in New Issue
Block a user