toeverything/AFFiNE
1
1
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2024-12-23 00:11:33 +03:00
Code Issues Packages Projects Releases Wiki Activity

feat: Intra-line double link interaction

Browse Source
This commit is contained in:
xiaodong zuo 2022-08-19 11:13:15 +08:00
parent dd1b160ef4
commit 2406f9556f
3 changed files with 57 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
libs/components/common/src/lib/text/slate-utils.ts
View File

@ -597,10 +597,11 @@ class SlateUtils {
const fragmentChildren = firstFragment.children;
const textChildren: Text[] = [];
for (const child of fragmentChildren) {
if ((child as any).type === 'link') {
textChildren.push(child as Text);
const textChildren = [];
for (let i = 0; i < fragmentChildren.length; i++) {
const child = fragmentChildren[i];
if ('type' in child && child.type === 'link') {
i !== fragmentChildren.length - 1 && textChildren.push(child);
continue;
}
if (!('text' in child)) {

28
libs/components/editor-core/src/editor/block/async-block.ts
View File

@ -508,21 +508,19 @@ export class AsyncBlock {
id: item.blockId,
});
if (linkBlock) {
let children = linkBlock.getProperties().text?.value || [];
if (children.length === 1 && !children[0].text) {
children = [{ text: 'Untitled' }];
}
if (
children.map(v => v.text).join('') !==
(item.children || []).map((v: any) => v.text).join('')
) {
const newItem = {
...item,
children: children,
};
values.splice(i, 1, newItem);
}
let children = linkBlock?.getProperties().text?.value || [];
if (children.length === 1 && !children[0].text) {
children = [{ text: 'Untitled' }];
}
if (
children.map(v => v.text).join('') !==
(item.children || []).map((v: any) => v.text).join('')
) {
const newItem = {
...item,
children: children,
};
values.splice(i, 1, newItem);
}
}
}

75
libs/components/editor-plugins/src/menu/double-link-menu/DoubleLinkMenu.tsx
View File

@ -135,6 +135,44 @@ export const DoubleLinkMenu = ({
editor.scrollManager.unLock();
}, [curBlockId, editor]);
const resetState = useCallback(
(preNodeId: string, nextNodeId: string) => {
editor.blockHelper.removeDoubleLinkSearchSlash(preNodeId);
setCurBlockId(nextNodeId);
setSearchText('');
setIsOpen(true);
editor.scrollManager.lock();
const clientRect =
editor.selection.currentSelectInfo?.browserSelection
?.getRangeAt(0)
?.getBoundingClientRect();
if (clientRect) {
const rectTop = clientRect.top;
const { top, left } = editor.container.getBoundingClientRect();
setDoubleLinkMenuStyle({
top: rectTop - top,
left: clientRect.left - left,
height: clientRect.height,
});
setAnchorEl(dialogRef.current);
}
setTimeout(() => {
const textSelection = editor.blockHelper.selectionToSlateRange(
nextNodeId,
editor.selection.currentSelectInfo.browserSelection
);
if (textSelection) {
const { anchor } = textSelection;
editor.blockHelper.setDoubleLinkSearchSlash(
nextNodeId,
anchor
);
}
});
},
[editor]
);
const searchChange = useCallback(
async (event: React.KeyboardEvent<HTMLDivElement>) => {
if (ARRAY_CODES.includes(event.code)) {
@ -162,41 +200,7 @@ export const DoubleLinkMenu = ({
anchorNode.id
);
if (text.endsWith('[[')) {
editor.blockHelper.removeDoubleLinkSearchSlash(curBlockId);
setCurBlockId(anchorNode.id);
setSearchText('');
setIsOpen(true);
editor.scrollManager.lock();
const clientRect =
editor.selection.currentSelectInfo?.browserSelection
?.getRangeAt(0)
?.getBoundingClientRect();
if (clientRect) {
const rectTop = clientRect.top;
const { top, left } =
editor.container.getBoundingClientRect();
setDoubleLinkMenuStyle({
top: rectTop - top,
left: clientRect.left - left,
height: clientRect.height,
});
setAnchorEl(dialogRef.current);
}
setTimeout(() => {
const textSelection =
editor.blockHelper.selectionToSlateRange(
anchorNode.id,
editor.selection.currentSelectInfo
.browserSelection
);
if (textSelection) {
const { anchor } = textSelection;
editor.blockHelper.setDoubleLinkSearchSlash(
anchorNode.id,
anchor
);
}
});
resetState(curBlockId, anchorNode.id);
}
}
if (isOpen) {
@ -372,7 +376,6 @@ export const DoubleLinkMenu = ({
</div>
);
};
const NewPageSearchContainer = styled('div')({
padding: '8px 8px 0px 8px',
});