@antv/infographic 0.2.13 → 0.2.14

package/esm/editor/commands/UpdateOptions.d.ts

@@ -1,14 +1,14 @@
-import type { ParsedInfographicOptions } from '../../options';
+import type { UpdatableInfographicOptions } from '../../options';
 import type { ICommand, IStateManager } from '../types';
 export declare class UpdateOptionsCommand implements ICommand {
     private options;
     private original?;
-    constructor(options: Partial<ParsedInfographicOptions>, original?: ParsedInfographicOptions | undefined);
+    constructor(options: UpdatableInfographicOptions, original?: UpdatableInfographicOptions | undefined);
     apply(state: IStateManager): Promise<void>;
     undo(state: IStateManager): Promise<void>;
     serialize(): {
         type: string;
-        options: Partial<ParsedInfographicOptions>;
-        original: ParsedInfographicOptions | undefined;
+        options: Partial<Omit<import("../../options").ParsedInfographicOptions, "container">>;
+        original: Partial<Omit<import("../../options").ParsedInfographicOptions, "container">> | undefined;
     };
 }

package/esm/editor/commands/UpdateOptions.js

@@ -14,11 +14,14 @@ export class UpdateOptionsCommand {
     }
     apply(state) {
         return __awaiter(this, void 0, void 0, function* () {
-            const prev = state.getOptions();
             if (!this.original) {
-                this.original = prev;
+                const prev = state.getOptions();
+                this.original = {};
+                Object.keys(this.options).forEach((key) => {
+                    this.original[key] = prev[key];
+                });
             }
-            state.updateOptions(Object.assign(Object.assign({}, prev), this.options));
+            state.updateOptions(this.options);
         });
     }
     undo(state) {

package/esm/editor/editor.d.ts

@@ -1,7 +1,7 @@
 import type { ParsedInfographicOptions } from '../options';
 import type { IEventEmitter } from '../types';
 import { InteractionManager } from './managers';
-import type { ICommandManager, IEditor, IPluginManager, IStateManager } from './types';
+import type { ICommandManager, IEditor, IPluginManager, IStateManager, ISyncRegistry, SyncHandler } from './types';
 export declare class Editor implements IEditor {
     private emitter;
     private document;
@@ -10,7 +10,11 @@ export declare class Editor implements IEditor {
     commander: ICommandManager;
     plugin: IPluginManager;
     interaction: InteractionManager;
+    syncRegistry: ISyncRegistry;
     constructor(emitter: IEventEmitter, document: SVGSVGElement, options: ParsedInfographicOptions);
+    registerSync(path: string, handler: SyncHandler, options?: {
+        immediate?: boolean;
+    }): () => void;
     getDocument(): SVGSVGElement;
     destroy(): void;
 }

package/esm/editor/editor.js

@@ -1,4 +1,6 @@
 import { CommandManager, InteractionManager, PluginManager, StateManager, } from './managers/index.js';
+import { SyncRegistry } from './managers/sync-registry.js';
+import { CoreSyncPlugin } from './plugins/index.js';
 export class Editor {
     constructor(emitter, document, options) {
         this.emitter = emitter;
@@ -12,6 +14,12 @@ export class Editor {
         const state = new StateManager();
         const plugin = new PluginManager();
         const interaction = new InteractionManager();
+        const syncRegistry = new SyncRegistry(() => state.getOptions());
+        this.commander = commander;
+        this.state = state;
+        this.plugin = plugin;
+        this.interaction = interaction;
+        this.syncRegistry = syncRegistry;
         commander.init({ state, emitter });
         state.init({
             emitter,
@@ -19,12 +27,15 @@ export class Editor {
             commander,
             options,
         });
+        // Load core plugin: CoreSyncPlugin (handles viewBox/padding sync)
+        const corePlugin = new CoreSyncPlugin();
+        const userPlugins = options.plugins || [];
         plugin.init({
             emitter,
             editor: this,
             commander,
             state,
-        }, options.plugins);
+        }, [corePlugin, ...userPlugins]);
         interaction.init({
             emitter,
             editor: this,
@@ -32,10 +43,9 @@ export class Editor {
             state,
             interactions: options.interactions,
         });
-        this.commander = commander;
-        this.state = state;
-        this.plugin = plugin;
-        this.interaction = interaction;
+    }
+    registerSync(path, handler, options) {
+        return this.syncRegistry.register(path, handler, options);
     }
     getDocument() {
         return this.document;
@@ -46,5 +56,6 @@ export class Editor {
         this.plugin.destroy();
         this.commander.destroy();
         this.state.destroy();
+        this.syncRegistry.destroy();
     }
 }

package/esm/editor/index.d.ts

@@ -1,3 +1,4 @@
+export * from './commands';
 export { Editor } from './editor';
 export * from './interactions';
 export * from './plugins';

package/esm/editor/index.js

@@ -1,3 +1,4 @@
+export * from './commands/index.js';
 export { Editor } from './editor.js';
 export * from './interactions/index.js';
 export * from './plugins/index.js';

package/esm/editor/interactions/brush-select.d.ts

@@ -19,5 +19,4 @@ export declare class BrushSelect extends Interaction implements IInteraction {
     private clearBrush;
     private collectSelection;
     private hasElementAtStart;
-    private isTextSelectionTarget;
 }

package/esm/editor/interactions/brush-select.js

@@ -8,7 +8,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { createElement, setAttributes } from '../../utils/index.js';
-import { clientToViewport, getElementViewportBounds, getEventTarget, getSelectableTarget, } from '../utils/index.js';
+import { clientToViewport, getElementViewportBounds, getEventTarget, getSelectableTarget, isTextSelectionTarget, } from '../utils/index.js';
 import { Interaction } from './base.js';
 export class BrushSelect extends Interaction {
     constructor() {
@@ -22,7 +22,7 @@ export class BrushSelect extends Interaction {
                 return;
             if (event.button !== 0)
                 return;
-            if (this.isTextSelectionTarget(event.target))
+            if (isTextSelectionTarget(event.target))
                 return;
             if (this.hasElementAtStart(event.target))
                 return;
@@ -170,12 +170,4 @@ export class BrushSelect extends Interaction {
             return true;
         return Boolean((_a = target.closest) === null || _a === void 0 ? void 0 : _a.call(target, '[data-element-type]'));
     }
-    isTextSelectionTarget(target) {
-        if (!(target instanceof HTMLElement))
-            return false;
-        if (target.isContentEditable)
-            return true;
-        const tag = target.tagName.toLowerCase();
-        return tag === 'input' || tag === 'textarea';
-    }
 }

package/esm/editor/interactions/drag-canvas.d.ts

@@ -0,0 +1,35 @@
+import { IInteraction, InteractionInitOptions, KeyCode } from '../types';
+import { Interaction } from './base';
+export interface DragCanvasOptions {
+    trigger?: KeyCode[];
+}
+export declare class DragCanvas extends Interaction implements IInteraction {
+    name: string;
+    /**
+     * 触发交互的按键代码。
+     * 参考标准的 KeyboardEvent.code 值：
+     * https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/code/code_values
+     * @default ['Space']
+     */
+    trigger: KeyCode[];
+    constructor(options?: DragCanvasOptions);
+    private isTriggerPressed;
+    private pointerId?;
+    private startPoint?;
+    private document;
+    private startViewBoxString?;
+    private completeInteraction?;
+    private isHovering;
+    init(options: InteractionInitOptions): void;
+    destroy(): void;
+    private handleKeyDown;
+    private handlePointerDown;
+    private handlePointerMove;
+    private handlePointerUp;
+    private handleKeyUp;
+    private stopDrag;
+    private setCursor;
+    private handleBlur;
+    private onMouseEnter;
+    private onMouseLeave;
+}

package/esm/editor/interactions/drag-canvas.js

@@ -0,0 +1,161 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { getViewBox, viewBoxToString } from '../../utils/index.js';
+import { UpdateOptionsCommand } from '../commands/index.js';
+import { clientToViewport, isTextSelectionTarget } from '../utils/index.js';
+import { Interaction } from './base.js';
+export class DragCanvas extends Interaction {
+    constructor(options) {
+        super();
+        this.name = 'drag-canvas';
+        /**
+         * 触发交互的按键代码。
+         * 参考标准的 KeyboardEvent.code 值：
+         * https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/code/code_values
+         * @default ['Space']
+         */
+        this.trigger = ['Space'];
+        this.isTriggerPressed = false;
+        // 防止组件快捷键侵入性过强
+        this.isHovering = false;
+        this.handleKeyDown = (event) => {
+            if (!this.interaction.isActive())
+                return;
+            if (isTextSelectionTarget(event.target))
+                return;
+            // 增加焦点的判断，防止对空格的preventDefault侵入性过强
+            const target = event.target;
+            const isBody = target === document.body || target === document.documentElement;
+            const isEditor = target === this.document || this.document.contains(target);
+            if (!isBody && !isEditor)
+                return;
+            if (!this.trigger.includes(event.code))
+                return;
+            if (!this.isHovering && !this.isTriggerPressed)
+                return;
+            event.preventDefault();
+            event.stopPropagation();
+            this.interaction.executeExclusiveInteraction(this, () => __awaiter(this, void 0, void 0, function* () {
+                return new Promise((resolve) => {
+                    this.completeInteraction = resolve;
+                    this.isTriggerPressed = true;
+                    const viewBox = getViewBox(this.document);
+                    this.startViewBoxString = viewBoxToString(viewBox);
+                    this.setCursor('grab');
+                    this.document.addEventListener('pointerdown', this.handlePointerDown);
+                    window.addEventListener('keyup', this.handleKeyUp);
+                });
+            }));
+        };
+        this.handlePointerDown = (event) => {
+            if (event.button !== 0)
+                return;
+            event.preventDefault();
+            event.stopPropagation();
+            const svg = this.document;
+            this.startPoint = clientToViewport(svg, event.clientX, event.clientY);
+            this.pointerId = event.pointerId;
+            this.setCursor('grabbing');
+            window.addEventListener('pointermove', this.handlePointerMove);
+            window.addEventListener('pointerup', this.handlePointerUp);
+            window.addEventListener('pointercancel', this.handlePointerUp);
+        };
+        this.handlePointerMove = (event) => {
+            if (event.pointerId !== this.pointerId || !this.startPoint)
+                return;
+            event.preventDefault();
+            event.stopPropagation();
+            const svg = this.document;
+            const current = clientToViewport(svg, event.clientX, event.clientY);
+            const dx = current.x - this.startPoint.x;
+            const dy = current.y - this.startPoint.y;
+            const viewBox = getViewBox(svg);
+            const { x, y, width, height } = viewBox;
+            const newX = x - dx;
+            const newY = y - dy;
+            this.state.updateOptions({
+                viewBox: viewBoxToString({ x: newX, y: newY, width, height }),
+            });
+        };
+        this.handlePointerUp = (event) => {
+            if (event.pointerId !== this.pointerId)
+                return;
+            this.startPoint = undefined;
+            this.pointerId = undefined;
+            this.setCursor('grab');
+            window.removeEventListener('pointermove', this.handlePointerMove);
+            window.removeEventListener('pointerup', this.handlePointerUp);
+            window.removeEventListener('pointercancel', this.handlePointerUp);
+        };
+        this.handleKeyUp = (event) => {
+            if (!this.trigger.includes(event.code))
+                return;
+            this.stopDrag();
+        };
+        this.stopDrag = () => {
+            var _a;
+            if (this.startViewBoxString) {
+                const svg = this.document;
+                const viewBox = getViewBox(svg);
+                const currentViewBoxString = viewBoxToString(viewBox);
+                if (this.startViewBoxString !== currentViewBoxString) {
+                    const command = new UpdateOptionsCommand({ viewBox: currentViewBoxString }, { viewBox: this.startViewBoxString });
+                    void this.commander.execute(command);
+                }
+            }
+            this.startViewBoxString = undefined;
+            this.isTriggerPressed = false;
+            this.setCursor('default');
+            this.startPoint = undefined;
+            this.pointerId = undefined;
+            window.removeEventListener('keyup', this.handleKeyUp);
+            this.document.removeEventListener('pointerdown', this.handlePointerDown);
+            window.removeEventListener('pointermove', this.handlePointerMove);
+            window.removeEventListener('pointerup', this.handlePointerUp);
+            window.removeEventListener('pointercancel', this.handlePointerUp);
+            (_a = this.completeInteraction) === null || _a === void 0 ? void 0 : _a.call(this);
+            this.completeInteraction = undefined;
+        };
+        this.setCursor = (behavior) => {
+            document.body.style.cursor = behavior;
+        };
+        this.handleBlur = () => {
+            this.stopDrag();
+        };
+        this.onMouseEnter = () => {
+            this.isHovering = true;
+        };
+        this.onMouseLeave = () => {
+            this.isHovering = false;
+        };
+        if (options === null || options === void 0 ? void 0 : options.trigger) {
+            this.trigger = options.trigger;
+        }
+    }
+    init(options) {
+        super.init(options);
+        this.document = this.editor.getDocument();
+        this.document.addEventListener('mouseenter', this.onMouseEnter);
+        this.document.addEventListener('mouseleave', this.onMouseLeave);
+        window.addEventListener('keydown', this.handleKeyDown);
+        window.addEventListener('blur', this.handleBlur);
+    }
+    destroy() {
+        window.removeEventListener('keydown', this.handleKeyDown);
+        window.removeEventListener('keyup', this.handleKeyUp);
+        this.document.removeEventListener('pointerdown', this.handlePointerDown);
+        window.removeEventListener('pointermove', this.handlePointerMove);
+        window.removeEventListener('pointerup', this.handlePointerUp);
+        window.removeEventListener('pointercancel', this.handlePointerUp);
+        window.removeEventListener('blur', this.handleBlur);
+        this.document.removeEventListener('mouseenter', this.onMouseEnter);
+        this.document.removeEventListener('mouseleave', this.onMouseLeave);
+    }
+}

package/esm/editor/interactions/drag-element.js

@@ -113,9 +113,6 @@ export class DragElement extends Interaction {
             return true;
         if (!this.startTarget)
             return false;
-        if (this.willReplaceSelection) {
-            this.interaction.select([this.startTarget], 'replace');
-        }
         this.dragItems = this.selectionForDrag
             .filter((element) => isEditableText(element))
             .map((element) => this.createDragItem(element))
@@ -125,6 +122,10 @@ export class DragElement extends Interaction {
         let started = false;
         this.interaction.executeExclusiveInteraction(this, () => __awaiter(this, void 0, void 0, function* () {
             return new Promise((resolve) => {
+                // 只有拿到锁之后，才真正执行选中逻辑
+                if (this.willReplaceSelection && this.startTarget) {
+                    this.interaction.select([this.startTarget], 'replace');
+                }
                 this.completeInteraction = resolve;
                 started = true;
             });

package/esm/editor/interactions/index.d.ts

@@ -2,6 +2,7 @@ export { Interaction } from './base';
 export { BrushSelect } from './brush-select';
 export { ClickSelect } from './click-select';
 export { DblClickEditText } from './dblclick-edit-text';
+export { DragCanvas } from './drag-canvas';
 export { DragElement } from './drag-element';
 export { HotkeyHistory } from './hotkey-history';
 export { SelectHighlight } from './select-highlight';

package/esm/editor/interactions/index.js

@@ -2,6 +2,7 @@ export { Interaction } from './base.js';
 export { BrushSelect } from './brush-select.js';
 export { ClickSelect } from './click-select.js';
 export { DblClickEditText } from './dblclick-edit-text.js';
+export { DragCanvas } from './drag-canvas.js';
 export { DragElement } from './drag-element.js';
 export { HotkeyHistory } from './hotkey-history.js';
 export { SelectHighlight } from './select-highlight.js';

package/esm/editor/interactions/zoom-wheel.d.ts

@@ -1,7 +1,16 @@
 import type { IInteraction, InteractionInitOptions } from '../types';
 import { Interaction } from './base';
+export interface ZoomWheelOptions {
+    minViewBoxSize?: number;
+    maxViewBoxSize?: number;
+}
 export declare class ZoomWheel extends Interaction implements IInteraction {
     name: string;
+    private minViewBoxSize;
+    private maxViewBoxSize;
+    constructor(options?: ZoomWheelOptions);
+    private initialViewBox;
+    private handleKeyUp;
     private wheelListener;
     private getMousePoint;
     private getCenterPoint;

package/esm/editor/interactions/zoom-wheel.js

@@ -3,13 +3,26 @@ import { calculateZoomedViewBox, getViewBox, viewBoxToString, } from '../../util
 import { UpdateOptionsCommand } from '../commands/index.js';
 import { clientToViewport } from '../utils/index.js';
 import { Interaction } from './base.js';
-const MIN_VIEWBOX_SIZE = 20;
-const MAX_VIEWBOX_SIZE = 2000;
 const ZOOM_FACTOR = 1.1;
 export class ZoomWheel extends Interaction {
-    constructor() {
-        super(...arguments);
+    constructor(options) {
+        super();
         this.name = 'zoom-wheel';
+        this.minViewBoxSize = 20;
+        this.maxViewBoxSize = 20000;
+        this.initialViewBox = null;
+        this.handleKeyUp = (event) => {
+            const isZoomModifierHeld = event.ctrlKey || event.metaKey || event.shiftKey;
+            if (!isZoomModifierHeld && this.initialViewBox) {
+                const currentViewBox = viewBoxToString(getViewBox(this.editor.getDocument()));
+                if (currentViewBox !== this.initialViewBox) {
+                    const command = new UpdateOptionsCommand({ viewBox: currentViewBox }, { viewBox: this.initialViewBox });
+                    void this.commander.execute(command);
+                }
+                this.initialViewBox = null;
+                document.removeEventListener('keyup', this.handleKeyUp);
+            }
+        };
         this.wheelListener = (event) => {
             if (!this.shouldZoom(event))
                 return;
@@ -22,25 +35,20 @@ export class ZoomWheel extends Interaction {
             const { width, height } = viewBox;
             const newWidth = width * factor;
             const newHeight = height * factor;
-            if (!inRange(newWidth, MIN_VIEWBOX_SIZE, MAX_VIEWBOX_SIZE) ||
-                !inRange(newHeight, MIN_VIEWBOX_SIZE, MAX_VIEWBOX_SIZE))
-                return;
-            // TODO: Remove after implementing the reset UI plugin
-            if ((event.ctrlKey || event.metaKey) && event.shiftKey) {
-                const command = new UpdateOptionsCommand({
-                    viewBox: undefined,
-                });
-                void this.commander.execute(command);
+            if (!inRange(newWidth, this.minViewBoxSize, this.maxViewBoxSize) ||
+                !inRange(newHeight, this.minViewBoxSize, this.maxViewBoxSize))
                 return;
+            if (this.initialViewBox === null) {
+                this.initialViewBox = viewBoxToString(viewBox);
+                document.addEventListener('keyup', this.handleKeyUp);
             }
             const pivot = (event.ctrlKey || event.metaKey) && !event.shiftKey
                 ? this.getMousePoint(svg, event)
                 : this.getCenterPoint(viewBox);
             const newViewBox = calculateZoomedViewBox(viewBox, factor, pivot);
-            const command = new UpdateOptionsCommand({
+            this.state.updateOptions({
                 viewBox: viewBoxToString(newViewBox),
             });
-            void this.commander.execute(command);
         };
         this.getMousePoint = (svg, event) => {
             return clientToViewport(svg, event.clientX, event.clientY);
@@ -57,8 +65,16 @@ export class ZoomWheel extends Interaction {
                 return false;
             const isMouseZoom = event.ctrlKey || event.metaKey;
             const isCenterZoom = event.shiftKey;
+            if (isMouseZoom && isCenterZoom)
+                return false;
             return isMouseZoom || isCenterZoom;
         };
+        if ((options === null || options === void 0 ? void 0 : options.minViewBoxSize) !== undefined) {
+            this.minViewBoxSize = options.minViewBoxSize;
+        }
+        if ((options === null || options === void 0 ? void 0 : options.maxViewBoxSize) !== undefined) {
+            this.maxViewBoxSize = options.maxViewBoxSize;
+        }
     }
     init(options) {
         super.init(options);
@@ -66,5 +82,6 @@ export class ZoomWheel extends Interaction {
     }
     destroy() {
         document.removeEventListener('wheel', this.wheelListener);
+        document.removeEventListener('keyup', this.handleKeyUp);
     }
 }

package/esm/editor/managers/index.d.ts

@@ -2,3 +2,4 @@ export * from './command';
 export * from './interaction';
 export * from './plugin';
 export * from './state';
+export * from './sync-registry';

package/esm/editor/managers/index.js

@@ -2,3 +2,4 @@ export * from './command.js';
 export * from './interaction.js';
 export * from './plugin.js';
 export * from './state.js';
+export * from './sync-registry.js';

package/esm/editor/managers/state.d.ts

@@ -1,4 +1,4 @@
-import type { ParsedInfographicOptions } from '../../options';
+import type { ParsedInfographicOptions, UpdatableInfographicOptions } from '../../options';
 import type { Element, IEventEmitter, ItemDatum } from '../../types';
 import type { ElementProps, ICommandManager, IEditor, IStateManager, StateManagerInitOptions } from '../types';
 export declare class StateManager implements IStateManager {
@@ -12,7 +12,9 @@ export declare class StateManager implements IStateManager {
     removeItemDatum(indexes: number[], count?: number): void;
     updateData(key: string, value: any): void;
     updateElement(element: Element, props: Partial<ElementProps>): void;
-    updateOptions(options: ParsedInfographicOptions): void;
+    updateOptions(options: UpdatableInfographicOptions, execOptions?: {
+        bubbleUp?: boolean;
+    }): void;
     getOptions(): ParsedInfographicOptions;
     /**
      * 不包含文本内容、图标类型更新

package/esm/editor/managers/state.js

@@ -1,5 +1,5 @@
-import { getDatumByIndexes, getElementRole, isIconElement, parsePadding, setSVGPadding, } from '../../utils/index.js';
-import { buildItemPath, getChildrenDataByIndexes, getIndexesFromElement, } from '../utils/index.js';
+import { getDatumByIndexes, getElementRole, isIconElement } from '../../utils/index.js';
+import { applyOptionUpdates, buildItemPath, getChildrenDataByIndexes, getIndexesFromElement, } from '../utils/index.js';
 export class StateManager {
     init(options) {
         Object.assign(this, options);
@@ -25,6 +25,8 @@ export class StateManager {
     }
     updateItemDatum(indexes, datum) {
         const item = getDatumByIndexes(this.options.data, indexes);
+        if (item == null || indexes.length === 0)
+            return;
         Object.assign(item, datum);
         this.emitter.emit('options:data:item:update', { indexes, datum });
         this.emitter.emit('options:change', {
@@ -74,17 +76,14 @@ export class StateManager {
     updateElement(element, props) {
         this.updateBuiltInElement(element, props);
     }
-    updateOptions(options) {
-        this.options = Object.assign(Object.assign({}, this.options), options);
-        if (this.options.viewBox) {
-            this.editor.getDocument().setAttribute('viewBox', this.options.viewBox);
-        }
-        else {
-            this.editor.getDocument().removeAttribute('viewBox');
-            if (this.options.padding !== undefined) {
-                setSVGPadding(this.editor.getDocument(), parsePadding(this.options.padding));
-            }
-        }
+    updateOptions(options, execOptions) {
+        const { bubbleUp = false } = execOptions || {};
+        applyOptionUpdates(this.options, options, '', {
+            bubbleUp,
+            collector: (path, newVal, oldVal) => {
+                this.editor.syncRegistry.trigger(path, newVal, oldVal);
+            },
+        });
         this.emitter.emit('options:change', {
             type: 'options:change',
             changes: [
@@ -115,6 +114,8 @@ export class StateManager {
         const indexes = isItemElement ? getIndexesFromElement(element) : undefined;
         if (isItemElement) {
             const datum = getDatumByIndexes(data, indexes);
+            if (datum == null)
+                return;
             const key = role.replace('item-', '');
             datum.attributes || (datum.attributes = {});
             (_a = datum.attributes)[key] || (_a[key] = {});

package/esm/editor/managers/sync-registry.d.ts

@@ -0,0 +1,15 @@
+import { ISyncRegistry, SyncHandler } from '../types';
+type OptionsGetter = () => any;
+export declare class SyncRegistry implements ISyncRegistry {
+    private getOptions;
+    private handlers;
+    private isDispatching;
+    private isDestroyed;
+    constructor(getOptions: OptionsGetter);
+    register(path: string, handler: SyncHandler, options?: {
+        immediate?: boolean;
+    }): () => void;
+    trigger(path: string, newVal: any, oldVal: any): void;
+    destroy(): void;
+}
+export {};

package/esm/editor/managers/sync-registry.js

@@ -0,0 +1,51 @@
+import { get } from 'lodash-es';
+export class SyncRegistry {
+    constructor(getOptions) {
+        this.getOptions = getOptions;
+        this.handlers = new Map();
+        // lock to prevent recursive updates
+        this.isDispatching = false;
+        this.isDestroyed = false;
+    }
+    register(path, handler, options) {
+        if (!this.handlers.has(path)) {
+            this.handlers.set(path, new Set());
+        }
+        this.handlers.get(path).add(handler);
+        if (options === null || options === void 0 ? void 0 : options.immediate) {
+            const currentVal = get(this.getOptions(), path);
+            handler(currentVal, undefined);
+        }
+        return () => {
+            const set = this.handlers.get(path);
+            if (set) {
+                set.delete(handler);
+                if (set.size === 0) {
+                    this.handlers.delete(path);
+                }
+            }
+        };
+    }
+    trigger(path, newVal, oldVal) {
+        if (this.isDestroyed || this.isDispatching) {
+            if (this.isDispatching) {
+                console.warn(`[SyncRegistry] Recursive update detected on ${path}. Skipped to prevent loop.`);
+            }
+            return;
+        }
+        const handlers = this.handlers.get(path);
+        if (handlers) {
+            this.isDispatching = true;
+            try {
+                handlers.forEach((fn) => fn(newVal, oldVal));
+            }
+            finally {
+                this.isDispatching = false;
+            }
+        }
+    }
+    destroy() {
+        this.isDestroyed = true;
+        this.handlers.clear();
+    }
+}