refactor(editor): replace debounce and throttle with lodash (#10639)

This commit is contained in:
Saul-Mirone
2025-03-06 04:46:52 +00:00
parent 824f573ff9
commit 2b30d756e2
27 changed files with 118 additions and 202 deletions

View File

@@ -26,7 +26,9 @@
"@lit/context": "^1.1.2", "@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0", "@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.12", "@toeverything/theme": "^1.1.12",
"@types/lodash-es": "^4.17.12",
"lit": "^3.2.0", "lit": "^3.2.0",
"lodash-es": "^4.17.21",
"minimatch": "^10.0.1", "minimatch": "^10.0.1",
"yjs": "^13.6.21", "yjs": "^13.6.21",
"zod": "^3.23.8" "zod": "^3.23.8"

View File

@@ -28,7 +28,6 @@ import {
} from '@blocksuite/affine-shared/utils'; } from '@blocksuite/affine-shared/utils';
import { BlockSelection } from '@blocksuite/block-std'; import { BlockSelection } from '@blocksuite/block-std';
import { Bound } from '@blocksuite/global/gfx'; import { Bound } from '@blocksuite/global/gfx';
import { throttle } from '@blocksuite/global/utils';
import { Text } from '@blocksuite/store'; import { Text } from '@blocksuite/store';
import { computed } from '@preact/signals-core'; import { computed } from '@preact/signals-core';
import { html, nothing } from 'lit'; import { html, nothing } from 'lit';
@@ -36,6 +35,7 @@ import { property, queryAsync, state } from 'lit/decorators.js';
import { classMap } from 'lit/directives/class-map.js'; import { classMap } from 'lit/directives/class-map.js';
import { styleMap } from 'lit/directives/style-map.js'; import { styleMap } from 'lit/directives/style-map.js';
import { when } from 'lit/directives/when.js'; import { when } from 'lit/directives/when.js';
import throttle from 'lodash-es/throttle';
import * as Y from 'yjs'; import * as Y from 'yjs';
import { EmbedBlockComponent } from '../common/embed-block-element.js'; import { EmbedBlockComponent } from '../common/embed-block-element.js';

View File

@@ -4,10 +4,11 @@ import {
isGfxBlockComponent, isGfxBlockComponent,
ShadowlessElement, ShadowlessElement,
} from '@blocksuite/block-std'; } from '@blocksuite/block-std';
import { throttle, WithDisposable } from '@blocksuite/global/utils'; import { WithDisposable } from '@blocksuite/global/utils';
import { html, nothing } from 'lit'; import { html, nothing } from 'lit';
import { property, queryAsync } from 'lit/decorators.js'; import { property, queryAsync } from 'lit/decorators.js';
import { classMap } from 'lit/directives/class-map.js'; import { classMap } from 'lit/directives/class-map.js';
import throttle from 'lodash-es/throttle';
import { import {
RENDER_CARD_THROTTLE_MS, RENDER_CARD_THROTTLE_MS,

View File

@@ -8,15 +8,12 @@ import {
} from '@blocksuite/block-std'; } from '@blocksuite/block-std';
import { GfxControllerIdentifier } from '@blocksuite/block-std/gfx'; import { GfxControllerIdentifier } from '@blocksuite/block-std/gfx';
import { Bound, deserializeXYWH } from '@blocksuite/global/gfx'; import { Bound, deserializeXYWH } from '@blocksuite/global/gfx';
import { import { DisposableGroup, WithDisposable } from '@blocksuite/global/utils';
debounce,
DisposableGroup,
WithDisposable,
} from '@blocksuite/global/utils';
import { type Query, type Store } from '@blocksuite/store'; import { type Query, type Store } from '@blocksuite/store';
import { css, html, nothing, type PropertyValues } from 'lit'; import { css, html, nothing, type PropertyValues } from 'lit';
import { property, query, state } from 'lit/decorators.js'; import { property, query, state } from 'lit/decorators.js';
import { styleMap } from 'lit/directives/style-map.js'; import { styleMap } from 'lit/directives/style-map.js';
import debounce from 'lodash-es/debounce';
import type { EdgelessRootPreviewBlockComponent } from '../../edgeless-root-preview-block.js'; import type { EdgelessRootPreviewBlockComponent } from '../../edgeless-root-preview-block.js';
@@ -182,7 +179,9 @@ export class FramePreview extends WithDisposable(ShadowlessElement) {
this._clearFrameDisposables(); this._clearFrameDisposables();
this._frameDisposables = new DisposableGroup(); this._frameDisposables = new DisposableGroup();
this._frameDisposables.add( this._frameDisposables.add(
frame.propsUpdated.on(debounce(this._updateFrameViewportWH, 10)) frame.propsUpdated.on(
debounce(this._updateFrameViewportWH, 10, { leading: true })
)
); );
} }

View File

@@ -11,7 +11,7 @@ import { property } from 'lit/decorators.js';
import { classMap } from 'lit/directives/class-map.js'; import { classMap } from 'lit/directives/class-map.js';
import { ifDefined } from 'lit/directives/if-defined.js'; import { ifDefined } from 'lit/directives/if-defined.js';
import { repeat } from 'lit/directives/repeat.js'; import { repeat } from 'lit/directives/repeat.js';
import { isEqual } from 'lodash-es'; import isEqual from 'lodash-es/isEqual';
function TransparentIcon(hollowCircle = false) { function TransparentIcon(hollowCircle = false) {
const CircleIcon: TemplateResult | typeof nothing = hollowCircle const CircleIcon: TemplateResult | typeof nothing = hollowCircle

View File

@@ -16,7 +16,7 @@ import {
import { stopPropagation } from '@blocksuite/affine-shared/utils'; import { stopPropagation } from '@blocksuite/affine-shared/utils';
import { WidgetComponent } from '@blocksuite/block-std'; import { WidgetComponent } from '@blocksuite/block-std';
import { GfxControllerIdentifier } from '@blocksuite/block-std/gfx'; import { GfxControllerIdentifier } from '@blocksuite/block-std/gfx';
import { debounce, Slot } from '@blocksuite/global/utils'; import { Slot } from '@blocksuite/global/utils';
import { import {
ArrowLeftSmallIcon, ArrowLeftSmallIcon,
ArrowRightSmallIcon, ArrowRightSmallIcon,
@@ -29,6 +29,7 @@ import { baseTheme, cssVar } from '@toeverything/theme';
import { css, html, nothing, unsafeCSS } from 'lit'; import { css, html, nothing, unsafeCSS } from 'lit';
import { query, state } from 'lit/decorators.js'; import { query, state } from 'lit/decorators.js';
import { cache } from 'lit/directives/cache.js'; import { cache } from 'lit/directives/cache.js';
import debounce from 'lodash-es/debounce';
import type { EdgelessRootBlockComponent } from '../../edgeless-root-block.js'; import type { EdgelessRootBlockComponent } from '../../edgeless-root-block.js';
import type { MenuPopper } from './common/create-popper.js'; import type { MenuPopper } from './common/create-popper.js';
@@ -233,36 +234,40 @@ export class EdgelessToolbarWidget extends WidgetComponent<
@state() @state()
accessor containerWidth = 1920; accessor containerWidth = 1920;
private readonly _onContainerResize = debounce(({ w }: { w: number }) => { private readonly _onContainerResize = debounce(
if (!this.isConnected) return; ({ w }: { w: number }) => {
if (!this.isConnected) return;
this.slots.resize.emit({ w, h: TOOLBAR_HEIGHT }); this.slots.resize.emit({ w, h: TOOLBAR_HEIGHT });
this.containerWidth = w; this.containerWidth = w;
if (this._denseSeniorTools) { if (this._denseSeniorTools) {
this.scrollSeniorToolIndex = Math.min( this.scrollSeniorToolIndex = Math.min(
this._seniorTools.length - this.scrollSeniorToolSize, this._seniorTools.length - this.scrollSeniorToolSize,
this.scrollSeniorToolIndex this.scrollSeniorToolIndex
); );
} else { } else {
this.scrollSeniorToolIndex = 0; this.scrollSeniorToolIndex = 0;
} }
if ( if (
this._denseQuickTools && this._denseQuickTools &&
this._moreQuickToolsMenu && this._moreQuickToolsMenu &&
this._moreQuickToolsMenuRef this._moreQuickToolsMenuRef
) { ) {
this._moreQuickToolsMenu.close(); this._moreQuickToolsMenu.close();
this._openMoreQuickToolsMenu({ this._openMoreQuickToolsMenu({
currentTarget: this._moreQuickToolsMenuRef, currentTarget: this._moreQuickToolsMenuRef,
}); });
} }
if (!this._denseQuickTools && this._moreQuickToolsMenu) { if (!this._denseQuickTools && this._moreQuickToolsMenu) {
this._moreQuickToolsMenu.close(); this._moreQuickToolsMenu.close();
this._moreQuickToolsMenu = null; this._moreQuickToolsMenu = null;
} }
}, 300); },
300,
{ leading: true }
);
private _resizeObserver: ResizeObserver | null = null; private _resizeObserver: ResizeObserver | null = null;

View File

@@ -12,16 +12,13 @@ import {
} from '@blocksuite/affine-shared/utils'; } from '@blocksuite/affine-shared/utils';
import { PropTypes, requiredProperties } from '@blocksuite/block-std'; import { PropTypes, requiredProperties } from '@blocksuite/block-std';
import { GfxControllerIdentifier } from '@blocksuite/block-std/gfx'; import { GfxControllerIdentifier } from '@blocksuite/block-std/gfx';
import { import { SignalWatcher, WithDisposable } from '@blocksuite/global/utils';
SignalWatcher,
throttle,
WithDisposable,
} from '@blocksuite/global/utils';
import { MoreHorizontalIcon } from '@blocksuite/icons/lit'; import { MoreHorizontalIcon } from '@blocksuite/icons/lit';
import { effect } from '@preact/signals-core'; import { effect } from '@preact/signals-core';
import { css, html, LitElement, nothing } from 'lit'; import { css, html, LitElement, nothing } from 'lit';
import { property, query, queryAll, state } from 'lit/decorators.js'; import { property, query, queryAll, state } from 'lit/decorators.js';
import { styleMap } from 'lit/directives/style-map.js'; import { styleMap } from 'lit/directives/style-map.js';
import throttle from 'lodash-es/throttle';
import { getPopperPosition } from '../../utils/position.js'; import { getPopperPosition } from '../../utils/position.js';
import type { LinkedDocContext, LinkedMenuGroup } from './config.js'; import type { LinkedDocContext, LinkedMenuGroup } from './config.js';

View File

@@ -4,12 +4,9 @@ import {
} from '@blocksuite/affine-components/rich-text'; } from '@blocksuite/affine-components/rich-text';
import type { UIEventStateContext } from '@blocksuite/block-std'; import type { UIEventStateContext } from '@blocksuite/block-std';
import { TextSelection, WidgetComponent } from '@blocksuite/block-std'; import { TextSelection, WidgetComponent } from '@blocksuite/block-std';
import { import { assertType, DisposableGroup } from '@blocksuite/global/utils';
assertType,
debounce,
DisposableGroup,
} from '@blocksuite/global/utils';
import { InlineEditor } from '@blocksuite/inline'; import { InlineEditor } from '@blocksuite/inline';
import debounce from 'lodash-es/debounce';
import type { RootBlockComponent } from '../../types.js'; import type { RootBlockComponent } from '../../types.js';
import { import {
@@ -75,7 +72,8 @@ const showSlashMenu = debounce(
container.append(slashMenu); container.append(slashMenu);
return slashMenu; return slashMenu;
}, },
100 100,
{ leading: true }
); );
export const AFFINE_SLASH_MENU_WIDGET = 'affine-slash-menu-widget'; export const AFFINE_SLASH_MENU_WIDGET = 'affine-slash-menu-widget';

View File

@@ -13,12 +13,13 @@ import {
isFuzzyMatch, isFuzzyMatch,
substringMatchScore, substringMatchScore,
} from '@blocksuite/affine-shared/utils'; } from '@blocksuite/affine-shared/utils';
import { throttle, WithDisposable } from '@blocksuite/global/utils'; import { WithDisposable } from '@blocksuite/global/utils';
import { autoPlacement, offset } from '@floating-ui/dom'; import { autoPlacement, offset } from '@floating-ui/dom';
import { html, LitElement, nothing, type PropertyValues } from 'lit'; import { html, LitElement, nothing, type PropertyValues } from 'lit';
import { property, state } from 'lit/decorators.js'; import { property, state } from 'lit/decorators.js';
import { ifDefined } from 'lit/directives/if-defined.js'; import { ifDefined } from 'lit/directives/if-defined.js';
import { styleMap } from 'lit/directives/style-map.js'; import { styleMap } from 'lit/directives/style-map.js';
import throttle from 'lodash-es/throttle';
import { getPopperPosition } from '../../utils/position.js'; import { getPopperPosition } from '../../utils/position.js';
import type { import type {

View File

@@ -26,13 +26,15 @@
"@preact/signals-core": "^1.8.0", "@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.12", "@toeverything/theme": "^1.1.12",
"@types/hast": "^3.0.4", "@types/hast": "^3.0.4",
"@types/katex": "^0.16.7",
"@types/lodash-es": "^4.17.12",
"@types/mdast": "^4.0.4", "@types/mdast": "^4.0.4",
"collapse-white-space": "^2.1.0", "collapse-white-space": "^2.1.0",
"date-fns": "^4.0.0", "date-fns": "^4.0.0",
"katex": "^0.16.11", "katex": "^0.16.11",
"lit": "^3.2.0", "lit": "^3.2.0",
"lit-html": "^3.2.1", "lit-html": "^3.2.1",
"lodash.clonedeep": "^4.5.0", "lodash-es": "^4.17.21",
"remark-math": "^6.0.0", "remark-math": "^6.0.0",
"shiki": "^3.0.0", "shiki": "^3.0.0",
"yjs": "^13.6.21", "yjs": "^13.6.21",
@@ -69,9 +71,5 @@
"!src/__tests__", "!src/__tests__",
"!dist/__tests__" "!dist/__tests__"
], ],
"devDependencies": {
"@types/katex": "^0.16.7",
"@types/lodash.clonedeep": "^4.5.9"
},
"version": "0.20.0" "version": "0.20.0"
} }

View File

@@ -16,9 +16,9 @@ import { SurfaceBlockModel } from '@blocksuite/block-std/gfx';
import { createIdentifier } from '@blocksuite/global/di'; import { createIdentifier } from '@blocksuite/global/di';
import type { IVec } from '@blocksuite/global/gfx'; import type { IVec } from '@blocksuite/global/gfx';
import { Point } from '@blocksuite/global/gfx'; import { Point } from '@blocksuite/global/gfx';
import { throttle } from '@blocksuite/global/utils';
import type { BlockModel, ExtensionType } from '@blocksuite/store'; import type { BlockModel, ExtensionType } from '@blocksuite/store';
import { computed, signal } from '@preact/signals-core'; import { computed, signal } from '@preact/signals-core';
import throttle from 'lodash-es/throttle';
import { DropIndicator } from './drop-indicator'; import { DropIndicator } from './drop-indicator';

View File

@@ -24,12 +24,12 @@
"@preact/signals-core": "^1.8.0", "@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.12", "@toeverything/theme": "^1.1.12",
"@types/hast": "^3.0.4", "@types/hast": "^3.0.4",
"@types/lodash-es": "^4.17.12",
"@types/mdast": "^4.0.4", "@types/mdast": "^4.0.4",
"dompurify": "^3.2.4", "dompurify": "^3.2.4",
"fractional-indexing": "^3.2.0", "fractional-indexing": "^3.2.0",
"lit": "^3.2.0", "lit": "^3.2.0",
"lodash.clonedeep": "^4.5.0", "lodash-es": "^4.17.21",
"lodash.mergewith": "^4.6.2",
"mdast-util-gfm-autolink-literal": "^2.0.1", "mdast-util-gfm-autolink-literal": "^2.0.1",
"mdast-util-gfm-footnote": "^2.0.0", "mdast-util-gfm-footnote": "^2.0.0",
"mdast-util-gfm-strikethrough": "^2.0.0", "mdast-util-gfm-strikethrough": "^2.0.0",
@@ -72,8 +72,6 @@
"!dist/__tests__" "!dist/__tests__"
], ],
"devDependencies": { "devDependencies": {
"@types/lodash.clonedeep": "^4.5.9",
"@types/lodash.mergewith": "^4",
"vitest": "3.0.7" "vitest": "3.0.7"
}, },
"version": "0.20.0" "version": "0.20.0"

View File

@@ -7,8 +7,8 @@ import {
Slot, Slot,
} from '@blocksuite/global/utils'; } from '@blocksuite/global/utils';
import { computed, type Signal, signal } from '@preact/signals-core'; import { computed, type Signal, signal } from '@preact/signals-core';
import clonedeep from 'lodash.clonedeep'; import clonedeep from 'lodash-es/cloneDeep';
import mergeWith from 'lodash.mergewith'; import mergeWith from 'lodash-es/mergeWith';
import * as Y from 'yjs'; import * as Y from 'yjs';
import { z } from 'zod'; import { z } from 'zod';

View File

@@ -1,5 +1,5 @@
import type { ReferenceInfo } from '@blocksuite/affine-model'; import type { ReferenceInfo } from '@blocksuite/affine-model';
import cloneDeep from 'lodash.clonedeep'; import cloneDeep from 'lodash-es/cloneDeep';
/** /**
* Clones reference info. * Clones reference info.

View File

@@ -8,7 +8,8 @@ import {
type GfxViewportElement, type GfxViewportElement,
} from '@blocksuite/block-std/gfx'; } from '@blocksuite/block-std/gfx';
import type { Container, ServiceIdentifier } from '@blocksuite/global/di'; import type { Container, ServiceIdentifier } from '@blocksuite/global/di';
import { debounce, DisposableGroup } from '@blocksuite/global/utils'; import { DisposableGroup } from '@blocksuite/global/utils';
import debounce from 'lodash-es/debounce';
import { import {
debugLog, debugLog,
@@ -144,13 +145,9 @@ export class ViewportTurboRendererExtension extends LifeCycleWatcher {
} }
} }
debouncedRefresh = debounce( debouncedRefresh = debounce(() => {
() => { this.refresh().catch(console.error);
this.refresh().catch(console.error); }, debounceTime);
},
debounceTime,
{ leading: false, trailing: true }
);
invalidate() { invalidate() {
this.layoutVersion++; this.layoutVersion++;

View File

@@ -30,7 +30,9 @@
"@lit/context": "^1.1.2", "@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0", "@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.12", "@toeverything/theme": "^1.1.12",
"@types/lodash-es": "^4.17.12",
"lit": "^3.2.0", "lit": "^3.2.0",
"lodash-es": "^4.17.21",
"minimatch": "^10.0.1", "minimatch": "^10.0.1",
"zod": "^3.23.8" "zod": "^3.23.8"
}, },

View File

@@ -8,8 +8,8 @@ import {
} from '@blocksuite/block-std'; } from '@blocksuite/block-std';
import { GfxControllerIdentifier } from '@blocksuite/block-std/gfx'; import { GfxControllerIdentifier } from '@blocksuite/block-std/gfx';
import { Point } from '@blocksuite/global/gfx'; import { Point } from '@blocksuite/global/gfx';
import { throttle } from '@blocksuite/global/utils';
import { computed } from '@preact/signals-core'; import { computed } from '@preact/signals-core';
import throttle from 'lodash-es/throttle';
import { import {
DRAG_HANDLE_CONTAINER_WIDTH, DRAG_HANDLE_CONTAINER_WIDTH,
@@ -34,6 +34,8 @@ import {
* Used to control the drag handle visibility in page mode * Used to control the drag handle visibility in page mode
*/ */
export class PointerEventWatcher { export class PointerEventWatcher {
private _isPointerDown = false;
private get _gfx() { private get _gfx() {
return this.widget.std.get(GfxControllerIdentifier); return this.widget.std.get(GfxControllerIdentifier);
} }
@@ -220,6 +222,7 @@ export class PointerEventWatcher {
private readonly _throttledPointerMoveHandler = throttle<UIEventHandler>( private readonly _throttledPointerMoveHandler = throttle<UIEventHandler>(
ctx => { ctx => {
if (this._isPointerDown) return;
if ( if (
this.widget.doc.readonly || this.widget.doc.readonly ||
this.widget.dragging || this.widget.dragging ||
@@ -231,6 +234,10 @@ export class PointerEventWatcher {
if (this.widget.isGfxDragHandleVisible) return; if (this.widget.isGfxDragHandleVisible) return;
const state = ctx.get('pointerState'); const state = ctx.get('pointerState');
// When pointer is moving, should do nothing
if (state.delta.x !== 0 && state.delta.y !== 0) return;
const { target } = state.raw; const { target } = state.raw;
const element = captureEventTarget(target); const element = captureEventTarget(target);
// When pointer not on block or on dragging, should do nothing // When pointer not on block or on dragging, should do nothing
@@ -330,6 +337,14 @@ export class PointerEventWatcher {
} }
}; };
private readonly _pointerDownHandler: UIEventHandler = () => {
this._isPointerDown = true;
};
private readonly _pointerUpHandler: UIEventHandler = () => {
this._isPointerDown = false;
};
constructor(readonly widget: AffineDragHandleWidget) {} constructor(readonly widget: AffineDragHandleWidget) {}
reset() { reset() {
@@ -341,5 +356,7 @@ export class PointerEventWatcher {
this.widget.handleEvent('click', this._clickHandler); this.widget.handleEvent('click', this._clickHandler);
this.widget.handleEvent('pointerMove', this._throttledPointerMoveHandler); this.widget.handleEvent('pointerMove', this._throttledPointerMoveHandler);
this.widget.handleEvent('pointerOut', this._pointerOutHandler); this.widget.handleEvent('pointerOut', this._pointerOutHandler);
this.widget.handleEvent('pointerDown', this._pointerDownHandler);
this.widget.handleEvent('pointerUp', this._pointerUpHandler);
} }
} }

View File

@@ -22,7 +22,9 @@
"@blocksuite/icons": "^2.2.3", "@blocksuite/icons": "^2.2.3",
"@preact/signals-core": "^1.8.0", "@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.12", "@toeverything/theme": "^1.1.12",
"lit": "^3.2.0" "@types/lodash-es": "^4.17.12",
"lit": "^3.2.0",
"lodash-es": "^4.17.21"
}, },
"exports": { "exports": {
".": "./src/index.ts", ".": "./src/index.ts",

View File

@@ -15,12 +15,12 @@ import {
WidgetComponent, WidgetComponent,
} from '@blocksuite/block-std'; } from '@blocksuite/block-std';
import { GfxControllerIdentifier } from '@blocksuite/block-std/gfx'; import { GfxControllerIdentifier } from '@blocksuite/block-std/gfx';
import { throttle } from '@blocksuite/global/utils';
import type { BaseSelection, UserInfo } from '@blocksuite/store'; import type { BaseSelection, UserInfo } from '@blocksuite/store';
import { computed, effect } from '@preact/signals-core'; import { computed, effect } from '@preact/signals-core';
import { css, html, nothing, type PropertyValues } from 'lit'; import { css, html, nothing, type PropertyValues } from 'lit';
import { state } from 'lit/decorators.js'; import { state } from 'lit/decorators.js';
import { styleMap } from 'lit/directives/style-map.js'; import { styleMap } from 'lit/directives/style-map.js';
import throttle from 'lodash-es/throttle';
import { RemoteColorManager } from '../manager/remote-color-manager'; import { RemoteColorManager } from '../manager/remote-color-manager';
import type { DocRemoteSelectionConfig } from './config'; import type { DocRemoteSelectionConfig } from './config';

View File

@@ -23,10 +23,12 @@
"@lit/context": "^1.1.2", "@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0", "@preact/signals-core": "^1.8.0",
"@types/hast": "^3.0.4", "@types/hast": "^3.0.4",
"@types/lodash-es": "^4.17.12",
"dompurify": "^3.2.4", "dompurify": "^3.2.4",
"fractional-indexing": "^3.2.0", "fractional-indexing": "^3.2.0",
"lib0": "^0.2.97", "lib0": "^0.2.97",
"lit": "^3.2.0", "lit": "^3.2.0",
"lodash-es": "^4.17.21",
"lz-string": "^1.5.0", "lz-string": "^1.5.0",
"rehype-parse": "^9.0.0", "rehype-parse": "^9.0.0",
"unified": "^11.0.5", "unified": "^11.0.5",

View File

@@ -5,8 +5,9 @@ import {
type IVec, type IVec,
Vec, Vec,
} from '@blocksuite/global/gfx'; } from '@blocksuite/global/gfx';
import { debounce, Slot } from '@blocksuite/global/utils'; import { Slot } from '@blocksuite/global/utils';
import { signal } from '@preact/signals-core'; import { signal } from '@preact/signals-core';
import debounce from 'lodash-es/debounce';
import type { GfxViewportElement } from '.'; import type { GfxViewportElement } from '.';
@@ -73,21 +74,13 @@ export class Viewport {
ZOOM_MIN = ZOOM_MIN; ZOOM_MIN = ZOOM_MIN;
private readonly _resetZooming = debounce( private readonly _resetZooming = debounce(() => {
() => { this.zooming$.value = false;
this.zooming$.value = false; }, 200);
},
200,
{ leading: false, trailing: true }
);
private readonly _resetPanning = debounce( private readonly _resetPanning = debounce(() => {
() => { this.panning$.value = false;
this.panning$.value = false; }, 200);
},
200,
{ leading: false, trailing: true }
);
constructor() { constructor() {
this.elementReady.once(el => (this._element = el)); this.elementReady.once(el => (this._element = el));

View File

@@ -1,5 +1,5 @@
import { throttle } from '@blocksuite/global/utils';
import type { BaseSelection, BlockModel } from '@blocksuite/store'; import type { BaseSelection, BlockModel } from '@blocksuite/store';
import throttle from 'lodash-es/throttle';
import { TextSelection } from '../selection/index.js'; import { TextSelection } from '../selection/index.js';
import type { BlockComponent } from '../view/element/block-component.js'; import type { BlockComponent } from '../view/element/block-component.js';
@@ -7,7 +7,6 @@ import { BLOCK_ID_ATTR } from '../view/index.js';
import { isActiveInEditor } from './active.js'; import { isActiveInEditor } from './active.js';
import { RANGE_SYNC_EXCLUDE_ATTR } from './consts.js'; import { RANGE_SYNC_EXCLUDE_ATTR } from './consts.js';
import type { RangeManager } from './range-manager.js'; import type { RangeManager } from './range-manager.js';
/** /**
* Two-way binding between native range and text selection * Two-way binding between native range and text selection
*/ */

View File

@@ -23,96 +23,6 @@ export function noop(_?: unknown) {
return; return;
} }
/**
* @example
* ```ts
* const log = (message: string) => console.log(`[${new Date().toISOString()}] ${message}`);
*
* const throttledLog = throttle(log, 1000);
*
* throttledLog("Hello, world!");
* throttledLog("Hello, world!");
* throttledLog("Hello, world!");
* throttledLog("Hello, world!");
* throttledLog("Hello, world!");
* ```
*/
export function throttle<T extends (...args: any[]) => any>(
fn: T,
limit: number,
options?: { leading?: boolean; trailing?: boolean }
): T;
export function throttle<
Args extends unknown[],
T extends (...args: Args) => void,
>(
fn: (...args: Args) => void,
limit: number,
options?: { leading?: boolean; trailing?: boolean }
): T;
export function throttle<
Args extends unknown[],
T extends (this: unknown, ...args: Args) => void,
>(fn: T, limit: number, { leading = true, trailing = true } = {}): T {
let timer: ReturnType<typeof setTimeout> | null = null;
let lastArgs: Args | null = null;
const setTimer = () => {
if (lastArgs && trailing) {
fn(...lastArgs);
lastArgs = null;
timer = setTimeout(setTimer, limit);
} else {
timer = null;
}
};
return function (this: unknown, ...args: Parameters<T>) {
if (timer) {
// in throttle
lastArgs = args;
return;
}
// Execute the function on the leading edge
if (leading) {
fn.apply(this, args);
}
timer = setTimeout(setTimer, limit);
} as T;
}
export const debounce = <T extends (...args: any[]) => void>(
fn: T,
limit: number,
{ leading = true, trailing = true } = {}
): T => {
let timer: ReturnType<typeof setTimeout> | null = null;
let lastArgs: Parameters<T> | null = null;
// eslint-disable-next-line sonarjs/no-identical-functions
const setTimer = () => {
if (lastArgs && trailing) {
fn(...lastArgs);
lastArgs = null;
timer = setTimeout(setTimer, limit);
} else {
timer = null;
}
};
return function (...args: Parameters<T>) {
if (timer) {
lastArgs = args;
clearTimeout(timer);
}
if (leading && !timer) {
fn(...args);
}
timer = setTimeout(setTimer, limit);
} as T;
};
export async function nextTick() { export async function nextTick() {
// @ts-expect-error check window.scheduler // @ts-expect-error check window.scheduler
if ('scheduler' in window && 'yield' in window.scheduler) { if ('scheduler' in window && 'yield' in window.scheduler) {

View File

@@ -1,5 +1,5 @@
import { throttle } from '@blocksuite/affine/global/utils';
import clsx from 'clsx'; import clsx from 'clsx';
import throttle from 'lodash-es/throttle';
import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react'; import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { observeResize } from '../../utils'; import { observeResize } from '../../utils';

View File

@@ -2,14 +2,11 @@ import {
type EditorHost, type EditorHost,
ShadowlessElement, ShadowlessElement,
} from '@blocksuite/affine/block-std'; } from '@blocksuite/affine/block-std';
import { import { SignalWatcher, WithDisposable } from '@blocksuite/affine/global/utils';
SignalWatcher,
throttle,
WithDisposable,
} from '@blocksuite/affine/global/utils';
import { Signal } from '@preact/signals-core'; import { Signal } from '@preact/signals-core';
import { html, type PropertyValues } from 'lit'; import { html, type PropertyValues } from 'lit';
import { property } from 'lit/decorators.js'; import { property } from 'lit/decorators.js';
import throttle from 'lodash-es/throttle';
import { extractMarkdownFromDoc } from '../../utils/extract'; import { extractMarkdownFromDoc } from '../../utils/extract';
import type { DocDisplayConfig } from '../chat-config'; import type { DocDisplayConfig } from '../chat-config';

View File

@@ -3,10 +3,11 @@ import {
ShadowlessElement, ShadowlessElement,
} from '@blocksuite/affine/block-std'; } from '@blocksuite/affine/block-std';
import { scrollbarStyle } from '@blocksuite/affine/blocks'; import { scrollbarStyle } from '@blocksuite/affine/blocks';
import { throttle, WithDisposable } from '@blocksuite/affine/global/utils'; import { WithDisposable } from '@blocksuite/affine/global/utils';
import type { PropertyValues } from 'lit'; import type { PropertyValues } from 'lit';
import { css, html } from 'lit'; import { css, html } from 'lit';
import { property, query } from 'lit/decorators.js'; import { property, query } from 'lit/decorators.js';
import throttle from 'lodash-es/throttle';
import type { import type {
AffineAIPanelState, AffineAIPanelState,

View File

@@ -2411,7 +2411,9 @@ __metadata:
"@lit/context": "npm:^1.1.2" "@lit/context": "npm:^1.1.2"
"@preact/signals-core": "npm:^1.8.0" "@preact/signals-core": "npm:^1.8.0"
"@toeverything/theme": "npm:^1.1.12" "@toeverything/theme": "npm:^1.1.12"
"@types/lodash-es": "npm:^4.17.12"
lit: "npm:^3.2.0" lit: "npm:^3.2.0"
lodash-es: "npm:^4.17.21"
minimatch: "npm:^10.0.1" minimatch: "npm:^10.0.1"
vitest: "npm:3.0.7" vitest: "npm:3.0.7"
yjs: "npm:^13.6.21" yjs: "npm:^13.6.21"
@@ -2710,14 +2712,14 @@ __metadata:
"@toeverything/theme": "npm:^1.1.12" "@toeverything/theme": "npm:^1.1.12"
"@types/hast": "npm:^3.0.4" "@types/hast": "npm:^3.0.4"
"@types/katex": "npm:^0.16.7" "@types/katex": "npm:^0.16.7"
"@types/lodash.clonedeep": "npm:^4.5.9" "@types/lodash-es": "npm:^4.17.12"
"@types/mdast": "npm:^4.0.4" "@types/mdast": "npm:^4.0.4"
collapse-white-space: "npm:^2.1.0" collapse-white-space: "npm:^2.1.0"
date-fns: "npm:^4.0.0" date-fns: "npm:^4.0.0"
katex: "npm:^0.16.11" katex: "npm:^0.16.11"
lit: "npm:^3.2.0" lit: "npm:^3.2.0"
lit-html: "npm:^3.2.1" lit-html: "npm:^3.2.1"
lodash.clonedeep: "npm:^4.5.0" lodash-es: "npm:^4.17.21"
remark-math: "npm:^6.0.0" remark-math: "npm:^6.0.0"
shiki: "npm:^3.0.0" shiki: "npm:^3.0.0"
yjs: "npm:^13.6.21" yjs: "npm:^13.6.21"
@@ -2803,14 +2805,12 @@ __metadata:
"@preact/signals-core": "npm:^1.8.0" "@preact/signals-core": "npm:^1.8.0"
"@toeverything/theme": "npm:^1.1.12" "@toeverything/theme": "npm:^1.1.12"
"@types/hast": "npm:^3.0.4" "@types/hast": "npm:^3.0.4"
"@types/lodash.clonedeep": "npm:^4.5.9" "@types/lodash-es": "npm:^4.17.12"
"@types/lodash.mergewith": "npm:^4"
"@types/mdast": "npm:^4.0.4" "@types/mdast": "npm:^4.0.4"
dompurify: "npm:^3.2.4" dompurify: "npm:^3.2.4"
fractional-indexing: "npm:^3.2.0" fractional-indexing: "npm:^3.2.0"
lit: "npm:^3.2.0" lit: "npm:^3.2.0"
lodash.clonedeep: "npm:^4.5.0" lodash-es: "npm:^4.17.21"
lodash.mergewith: "npm:^4.6.2"
mdast-util-gfm-autolink-literal: "npm:^2.0.1" mdast-util-gfm-autolink-literal: "npm:^2.0.1"
mdast-util-gfm-footnote: "npm:^2.0.0" mdast-util-gfm-footnote: "npm:^2.0.0"
mdast-util-gfm-strikethrough: "npm:^2.0.0" mdast-util-gfm-strikethrough: "npm:^2.0.0"
@@ -2857,7 +2857,9 @@ __metadata:
"@lit/context": "npm:^1.1.2" "@lit/context": "npm:^1.1.2"
"@preact/signals-core": "npm:^1.8.0" "@preact/signals-core": "npm:^1.8.0"
"@toeverything/theme": "npm:^1.1.12" "@toeverything/theme": "npm:^1.1.12"
"@types/lodash-es": "npm:^4.17.12"
lit: "npm:^3.2.0" lit: "npm:^3.2.0"
lodash-es: "npm:^4.17.21"
minimatch: "npm:^10.0.1" minimatch: "npm:^10.0.1"
zod: "npm:^3.23.8" zod: "npm:^3.23.8"
languageName: unknown languageName: unknown
@@ -2910,7 +2912,9 @@ __metadata:
"@blocksuite/icons": "npm:^2.2.3" "@blocksuite/icons": "npm:^2.2.3"
"@preact/signals-core": "npm:^1.8.0" "@preact/signals-core": "npm:^1.8.0"
"@toeverything/theme": "npm:^1.1.12" "@toeverything/theme": "npm:^1.1.12"
"@types/lodash-es": "npm:^4.17.12"
lit: "npm:^3.2.0" lit: "npm:^3.2.0"
lodash-es: "npm:^4.17.21"
languageName: unknown languageName: unknown
linkType: soft linkType: soft
@@ -2954,10 +2958,12 @@ __metadata:
"@lit/context": "npm:^1.1.2" "@lit/context": "npm:^1.1.2"
"@preact/signals-core": "npm:^1.8.0" "@preact/signals-core": "npm:^1.8.0"
"@types/hast": "npm:^3.0.4" "@types/hast": "npm:^3.0.4"
"@types/lodash-es": "npm:^4.17.12"
dompurify: "npm:^3.2.4" dompurify: "npm:^3.2.4"
fractional-indexing: "npm:^3.2.0" fractional-indexing: "npm:^3.2.0"
lib0: "npm:^0.2.97" lib0: "npm:^0.2.97"
lit: "npm:^3.2.0" lit: "npm:^3.2.0"
lodash-es: "npm:^4.17.21"
lz-string: "npm:^1.5.0" lz-string: "npm:^1.5.0"
rehype-parse: "npm:^9.0.0" rehype-parse: "npm:^9.0.0"
unified: "npm:^11.0.5" unified: "npm:^11.0.5"
@@ -14146,15 +14152,6 @@ __metadata:
languageName: node languageName: node
linkType: hard linkType: hard
"@types/lodash.mergewith@npm:^4":
version: 4.6.9
resolution: "@types/lodash.mergewith@npm:4.6.9"
dependencies:
"@types/lodash": "npm:*"
checksum: 10/c5a67e83040103decfd37090127118f5758773d0ce2a1756d442b371721737c7752f48f62544cc970f44abec8471f260cc4c844e1a4fdef8b76cb96bdec8a595
languageName: node
linkType: hard
"@types/lodash@npm:*": "@types/lodash@npm:*":
version: 4.17.15 version: 4.17.15
resolution: "@types/lodash@npm:4.17.15" resolution: "@types/lodash@npm:4.17.15"