fix: autofocus when create group in board

This commit is contained in:
alt0 2022-08-18 15:45:58 +08:00
parent 5d32d656d5
commit 41bb7368ff

View File

@ -8,6 +8,7 @@ import {
TDShapeType, TDShapeType,
TransformInfo, TransformInfo,
} from '@toeverything/components/board-types'; } from '@toeverything/components/board-types';
import type { BlockEditor } from '@toeverything/components/editor-core';
import { MIN_PAGE_WIDTH } from '@toeverything/components/editor-core'; import { MIN_PAGE_WIDTH } from '@toeverything/components/editor-core';
import { styled } from '@toeverything/components/ui'; import { styled } from '@toeverything/components/ui';
import type { SyntheticEvent } from 'react'; import type { SyntheticEvent } from 'react';
@ -66,6 +67,7 @@ export class EditorUtil extends TDShapeUtil<T, E> {
Component = TDShapeUtil.Component<T, E, TDMeta>( Component = TDShapeUtil.Component<T, E, TDMeta>(
({ shape, meta: { app }, events, isEditing, onShapeChange }, ref) => { ({ shape, meta: { app }, events, isEditing, onShapeChange }, ref) => {
const containerRef = useRef<HTMLDivElement>(); const containerRef = useRef<HTMLDivElement>();
const editorRef = useRef<BlockEditor>();
const { const {
workspace, workspace,
rootBlockId, rootBlockId,
@ -135,6 +137,18 @@ export class EditorUtil extends TDShapeUtil<T, E> {
} }
}, [app, state, shape.id, editingText, editingId]); }, [app, state, shape.id, editingText, editingId]);
useEffect(() => {
(async () => {
if (isEditing) {
const lastBlock =
await editorRef.current.getLastBlock();
editorRef.current.selectionManager.activeNodeByNodeId(
lastBlock.id
);
}
})();
}, [isEditing]);
return ( return (
<HTMLContainer ref={ref} {...events}> <HTMLContainer ref={ref} {...events}>
<Container <Container
@ -149,6 +163,7 @@ export class EditorUtil extends TDShapeUtil<T, E> {
rootBlockId={rootBlockId} rootBlockId={rootBlockId}
scrollBlank={false} scrollBlank={false}
isEdgeless isEdgeless
ref={editorRef}
/> />
{editingText ? null : <Mask />} {editingText ? null : <Mask />}
</Container> </Container>