mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-09-06 00:41:39 +08:00
Merge pull request #329 from toeverything/feature-toc-optiscroll-mitsuha-dev
feature: 1.add primary ability in scroll scrollIntoViewByBlockId API;
This commit is contained in:
@@ -6,7 +6,6 @@ import {
|
|||||||
useCallback,
|
useCallback,
|
||||||
useContext,
|
useContext,
|
||||||
useEffect,
|
useEffect,
|
||||||
useMemo,
|
|
||||||
useRef,
|
useRef,
|
||||||
useState,
|
useState,
|
||||||
} from 'react';
|
} from 'react';
|
||||||
@@ -168,10 +167,6 @@ export const TOC = () => {
|
|||||||
}, [updateTocDataSource]);
|
}, [updateTocDataSource]);
|
||||||
|
|
||||||
const onClick = async (blockId?: string) => {
|
const onClick = async (blockId?: string) => {
|
||||||
if (blockId === activeBlockId) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
setActiveBlockId(blockId);
|
setActiveBlockId(blockId);
|
||||||
await editor.scrollManager.scrollIntoViewByBlockId(blockId);
|
await editor.scrollManager.scrollIntoViewByBlockId(blockId);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { CSSProperties, type UIEvent } from 'react';
|
|
||||||
import EventEmitter from 'eventemitter3';
|
import EventEmitter from 'eventemitter3';
|
||||||
|
import { type UIEvent } from 'react';
|
||||||
|
|
||||||
import { domToRect, Rect } from '@toeverything/utils';
|
import { domToRect, Rect } from '@toeverything/utils';
|
||||||
import type { Editor as BlockEditor } from '../editor';
|
import type { Editor as BlockEditor } from '../editor';
|
||||||
@@ -164,22 +164,9 @@ export class ScrollManager {
|
|||||||
if (!block.dom) {
|
if (!block.dom) {
|
||||||
return console.warn(`Block is not exist.`);
|
return console.warn(`Block is not exist.`);
|
||||||
}
|
}
|
||||||
const containerRect = domToRect(this._scrollContainer);
|
|
||||||
const blockRect = domToRect(block.dom);
|
|
||||||
|
|
||||||
const blockRelativeTopToEditor =
|
/* use dom primary ability */
|
||||||
blockRect.top - containerRect.top - containerRect.height / 4;
|
block.dom.scrollIntoView({ block: 'start', behavior });
|
||||||
const blockRelativeLeftToEditor = blockRect.left - containerRect.left;
|
|
||||||
|
|
||||||
this.scrollTo({
|
|
||||||
left: blockRelativeLeftToEditor,
|
|
||||||
top: blockRelativeTopToEditor,
|
|
||||||
behavior,
|
|
||||||
});
|
|
||||||
this._updateScrollInfo(
|
|
||||||
blockRelativeLeftToEditor,
|
|
||||||
blockRelativeTopToEditor
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
public async keepBlockInView(
|
public async keepBlockInView(
|
||||||
|
|||||||
Reference in New Issue
Block a user