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,12 +167,12 @@ 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,
|
||||||
|
'smooth',
|
||||||
|
'primary'
|
||||||
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
@@ -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';
|
||||||
@@ -14,6 +14,8 @@ type ScrollController = {
|
|||||||
unLockScroll: () => void;
|
unLockScroll: () => void;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
type ScrollPrimary = undefined | 'primary';
|
||||||
|
|
||||||
export class ScrollManager {
|
export class ScrollManager {
|
||||||
private _editor: BlockEditor;
|
private _editor: BlockEditor;
|
||||||
private _scrollContainer: HTMLElement;
|
private _scrollContainer: HTMLElement;
|
||||||
@@ -150,20 +152,29 @@ export class ScrollManager {
|
|||||||
|
|
||||||
public async scrollIntoViewByBlockId(
|
public async scrollIntoViewByBlockId(
|
||||||
blockId: string,
|
blockId: string,
|
||||||
behavior: ScrollBehavior = 'smooth'
|
behavior: ScrollBehavior = 'smooth',
|
||||||
|
ability?: ScrollPrimary
|
||||||
) {
|
) {
|
||||||
const block = await this._editor.getBlockById(blockId);
|
const block = await this._editor.getBlockById(blockId);
|
||||||
|
|
||||||
await this.scrollIntoViewByBlock(block, behavior);
|
await this.scrollIntoViewByBlock(block, behavior, ability);
|
||||||
}
|
}
|
||||||
|
|
||||||
public async scrollIntoViewByBlock(
|
public async scrollIntoViewByBlock(
|
||||||
block: AsyncBlock,
|
block: AsyncBlock,
|
||||||
behavior: ScrollBehavior = 'smooth'
|
behavior: ScrollBehavior = 'smooth',
|
||||||
|
ability?: ScrollPrimary
|
||||||
) {
|
) {
|
||||||
if (!block.dom) {
|
if (!block.dom) {
|
||||||
return console.warn(`Block is not exist.`);
|
return console.warn(`Block is not exist.`);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* use dom primary ability */
|
||||||
|
if (ability === 'primary') {
|
||||||
|
block.dom.scrollIntoView({ block: 'start', behavior });
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
const containerRect = domToRect(this._scrollContainer);
|
const containerRect = domToRect(this._scrollContainer);
|
||||||
const blockRect = domToRect(block.dom);
|
const blockRect = domToRect(block.dom);
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user