@antv/infographic 0.2.13 → 0.2.14

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

@@ -6,13 +6,26 @@ const viewbox_1 = require("../../utils/viewbox");
 const commands_1 = require("../commands");
 const utils_1 = require("../utils");
 const base_1 = require("./base");
-const MIN_VIEWBOX_SIZE = 20;
-const MAX_VIEWBOX_SIZE = 2000;
 const ZOOM_FACTOR = 1.1;
 class ZoomWheel extends base_1.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 = (0, viewbox_1.viewBoxToString)((0, viewbox_1.getViewBox)(this.editor.getDocument()));
+                if (currentViewBox !== this.initialViewBox) {
+                    const command = new commands_1.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;
@@ -25,25 +38,20 @@ class ZoomWheel extends base_1.Interaction {
             const { width, height } = viewBox;
             const newWidth = width * factor;
             const newHeight = height * factor;
-            if (!(0, lodash_es_1.inRange)(newWidth, MIN_VIEWBOX_SIZE, MAX_VIEWBOX_SIZE) ||
-                !(0, lodash_es_1.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 commands_1.UpdateOptionsCommand({
-                    viewBox: undefined,
-                });
-                void this.commander.execute(command);
+            if (!(0, lodash_es_1.inRange)(newWidth, this.minViewBoxSize, this.maxViewBoxSize) ||
+                !(0, lodash_es_1.inRange)(newHeight, this.minViewBoxSize, this.maxViewBoxSize))
                 return;
+            if (this.initialViewBox === null) {
+                this.initialViewBox = (0, viewbox_1.viewBoxToString)(viewBox);
+                document.addEventListener('keyup', this.handleKeyUp);
             }
             const pivot = (event.ctrlKey || event.metaKey) && !event.shiftKey
                 ? this.getMousePoint(svg, event)
                 : this.getCenterPoint(viewBox);
             const newViewBox = (0, viewbox_1.calculateZoomedViewBox)(viewBox, factor, pivot);
-            const command = new commands_1.UpdateOptionsCommand({
+            this.state.updateOptions({
                 viewBox: (0, viewbox_1.viewBoxToString)(newViewBox),
             });
-            void this.commander.execute(command);
         };
         this.getMousePoint = (svg, event) => {
             return (0, utils_1.clientToViewport)(svg, event.clientX, event.clientY);
@@ -60,8 +68,16 @@ class ZoomWheel extends base_1.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);
@@ -69,6 +85,7 @@ class ZoomWheel extends base_1.Interaction {
     }
     destroy() {
         document.removeEventListener('wheel', this.wheelListener);
+        document.removeEventListener('keyup', this.handleKeyUp);
     }
 }
 exports.ZoomWheel = ZoomWheel;

package/lib/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/lib/editor/managers/index.js

@@ -18,3 +18,4 @@ __exportStar(require("./command"), exports);
 __exportStar(require("./interaction"), exports);
 __exportStar(require("./plugin"), exports);
 __exportStar(require("./state"), exports);
+__exportStar(require("./sync-registry"), exports);

package/lib/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/lib/editor/managers/state.js

@@ -28,6 +28,8 @@ class StateManager {
     }
     updateItemDatum(indexes, datum) {
         const item = (0, utils_1.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', {
@@ -77,17 +79,14 @@ 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) {
-                (0, utils_1.setSVGPadding)(this.editor.getDocument(), (0, utils_1.parsePadding)(this.options.padding));
-            }
-        }
+    updateOptions(options, execOptions) {
+        const { bubbleUp = false } = execOptions || {};
+        (0, utils_2.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: [
@@ -118,6 +117,8 @@ class StateManager {
         const indexes = isItemElement ? (0, utils_2.getIndexesFromElement)(element) : undefined;
         if (isItemElement) {
             const datum = (0, utils_1.getDatumByIndexes)(data, indexes);
+            if (datum == null)
+                return;
             const key = role.replace('item-', '');
             datum.attributes || (datum.attributes = {});
             (_a = datum.attributes)[key] || (_a[key] = {});

package/lib/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/lib/editor/managers/sync-registry.js

@@ -0,0 +1,55 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SyncRegistry = void 0;
+const lodash_es_1 = require("lodash-es");
+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 = (0, lodash_es_1.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();
+    }
+}
+exports.SyncRegistry = SyncRegistry;

package/lib/editor/plugins/{edit-bar/components → components}/button.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.IconButton = void 0;
-const utils_1 = require("../../../../utils");
+const utils_1 = require("../../../utils");
 const IconButton = ({ icon, onClick, activate = false, }) => {
     ensureIconButtonStyle();
     const button = document.createElement('button');

package/lib/editor/plugins/{edit-bar/components → components}/color-picker.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ColorPicker = ColorPicker;
 const culori_1 = require("culori");
-const utils_1 = require("../../../../utils");
+const utils_1 = require("../../../utils");
 const COLOR_PICKER_CLASS = 'infographic-color-picker';
 const COLOR_PICKER_SWATCHES_CLASS = `${COLOR_PICKER_CLASS}__swatches`;
 const COLOR_PICKER_SWATCH_CLASS = `${COLOR_PICKER_CLASS}__swatch`;

package/lib/editor/plugins/{edit-bar/components → components}/icons.d.ts

@@ -13,6 +13,7 @@ export declare const TEXT_ICONS: {
     alignCenter: ({ fill }?: IconProps) => HTMLElement;
     alignMiddle: ({ fill }?: IconProps) => HTMLElement;
 };
+export declare const RESET_ICON: ({ fill }?: IconProps) => HTMLElement;
 export declare const ELEMENT_ICONS: {
     align: ({ fill }?: IconProps) => HTMLElement;
     alignTop: ({ fill }?: IconProps) => HTMLElement;

package/lib/editor/plugins/{edit-bar/components → components}/icons.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ELEMENT_ICONS = exports.TEXT_ICONS = void 0;
+exports.ELEMENT_ICONS = exports.RESET_ICON = exports.TEXT_ICONS = void 0;
 const createIcon = (children, { viewBox = '0 0 1024 1024', size = '1.5em' } = {}) => ({ fill = 'currentColor' } = {}) => {
     const html = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="${viewBox}" width="${size}" height="${size}" fill="${fill}">
 ${children.trim()}
@@ -19,6 +19,7 @@ exports.TEXT_ICONS = {
     alignCenter: createIcon(`<path d="M768 800.339c17.673 0 32 14.327 32 32 0 17.496-14.042 31.713-31.47 31.995l-0.53 0.005H256c-17.673 0-32-14.327-32-32 0-17.497 14.042-31.713 31.47-31.996l0.53-0.004h512z m128-213.226c17.673 0 32 14.327 32 32 0 17.496-14.042 31.713-31.47 31.996l-0.53 0.004H128c-17.673 0-32-14.327-32-32 0-17.496 14.042-31.713 31.47-31.996l0.53-0.004h768zM768 373.887c17.673 0 32 14.327 32 32 0 17.496-14.042 31.713-31.47 31.996l-0.53 0.004H256c-17.673 0-32-14.327-32-32 0-17.496 14.042-31.713 31.47-31.996l0.53-0.004h512z m128-213.226c17.673 0 32 14.327 32 32 0 17.497-14.042 31.713-31.47 31.996l-0.53 0.004H128c-17.673 0-32-14.327-32-32 0-17.496 14.042-31.713 31.47-31.995l0.53-0.005h768z"></path>`),
     alignMiddle: createIcon(`<path d="M534.246 617.448l0.377 0.371 128 127.952c12.5 12.494 12.503 32.755 0.009 45.255-12.37 12.374-32.352 12.501-44.878 0.38l-0.377-0.372-73.38-73.352V939c0 17.673-14.326 32-32 32-17.496 0-31.712-14.042-31.995-31.47l-0.004-0.53-0.001-221.314-73.374 73.348c-12.374 12.37-32.356 12.49-44.878 0.363l-0.377-0.371c-12.37-12.375-12.49-32.356-0.362-44.878l0.37-0.377 128-127.952c12.372-12.366 32.347-12.49 44.87-0.37zM896 480.508c17.673 0 32 14.327 32 32 0 17.497-14.042 31.713-31.47 31.996l-0.53 0.004H128c-17.673 0-32-14.327-32-32 0-17.496 14.042-31.713 31.47-31.995l0.53-0.005h768zM511.998 54c17.496 0 31.713 14.042 31.996 31.47l0.004 0.53-0.001 221.314 73.38-73.349c12.499-12.494 32.76-12.49 45.255 0.009 12.37 12.374 12.49 32.356 0.362 44.878l-0.37 0.377-128 127.951c-12.372 12.366-32.347 12.49-44.87 0.371l-0.377-0.37-128-127.952c-12.5-12.495-12.503-32.756-0.009-45.255 12.37-12.374 32.352-12.502 44.878-0.38l0.377 0.371 73.374 73.346V86c0-17.673 14.328-32 32-32z"></path>`),
 };
+exports.RESET_ICON = createIcon(`<path d="M502.714987 58.258904l-126.531056-54.617723a52.797131 52.797131 0 0 0-41.873587 96.855428A447.865322 447.865322 0 0 0 392.02307 946.707184a61.535967 61.535967 0 0 0 13.83649 1.820591 52.797131 52.797131 0 0 0 13.65443-103.773672 342.453118 342.453118 0 0 1-31.678278-651.771485l-8.374718 19.480321a52.615072 52.615072 0 0 0 27.855039 69.182448 51.522718 51.522718 0 0 0 20.572675 4.369418A52.797131 52.797131 0 0 0 476.498481 254.882703L530.205907 127.441352a52.979191 52.979191 0 0 0-27.49092-69.182448zM962.960326 509.765407A448.775617 448.775617 0 0 0 643.992829 68.090094a52.797131 52.797131 0 1 0-30.403866 101.042786A342.635177 342.635177 0 0 1 674.578753 801.059925a52.615072 52.615072 0 0 0-92.30395-50.612422l-71.913335 117.246043a52.433013 52.433013 0 0 0 17.295612 72.82363l117.063985 72.823629a52.797131 52.797131 0 1 0 54.617722-89.755123l-16.021198-10.013249A448.593558 448.593558 0 0 0 962.960326 509.765407z" p-id="1630"/>`);
 exports.ELEMENT_ICONS = {
     align: createIcon(`<path d="M555.188 715.059c17.673 0 32 14.327 32 32V875c0 17.673-14.327 32-32 32H171c-17.673 0-32-14.327-32-32V747.059c0-17.673 14.327-32 32-32z m-32.001 63.999H203V843h320.187v-63.942zM854 416.529c17.673 0 32 14.327 32 32v127.942c0 17.673-14.327 32-32 32H171c-17.673 0-32-14.327-32-32V448.529c0-17.673 14.327-32 32-32z m-32 64H203v63.941h619v-63.941zM683.25 118c17.673 0 32 14.327 32 32v127.941c0 17.673-14.327 32-32 32H171c-17.673 0-32-14.327-32-32V150c0-17.673 14.327-32 32-32z m-32 64H203v63.941h448.25V182z"></path>`),
     alignTop: createIcon(`

package/lib/editor/plugins/{edit-bar/components → components}/popover.js

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Popover = Popover;
-const constants_1 = require("../../../../constants");
-const utils_1 = require("../../../../utils");
+const constants_1 = require("../../../constants");
+const utils_1 = require("../../../utils");
 const POPOVER_CLASS = 'infographic-edit-popover';
 const POPOVER_CONTENT_CLASS = `${POPOVER_CLASS}__content`;
 const POPOVER_ARROW_CLASS = `${POPOVER_CLASS}__arrow`;

package/lib/editor/plugins/{edit-bar/components → components}/select.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Select = Select;
-const utils_1 = require("../../../../utils");
+const utils_1 = require("../../../utils");
 const SELECT_CLASS = 'infographic-edit-select';
 const SELECT_STYLE_ID = 'infographic-edit-select-style';
 const OPTION_CLASS = `${SELECT_CLASS}__option`;

package/lib/editor/plugins/core-sync.d.ts

@@ -0,0 +1,8 @@
+import type { IPlugin, PluginInitOptions } from '../types';
+import { Plugin } from './base';
+export declare class CoreSyncPlugin extends Plugin implements IPlugin {
+    name: string;
+    private unregisters;
+    init(options: PluginInitOptions): void;
+    destroy(): void;
+}

package/lib/editor/plugins/core-sync.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CoreSyncPlugin = void 0;
+const utils_1 = require("../../utils");
+const base_1 = require("./base");
+class CoreSyncPlugin extends base_1.Plugin {
+    constructor() {
+        super(...arguments);
+        this.name = 'core-sync';
+        this.unregisters = [];
+    }
+    init(options) {
+        super.init(options);
+        const svg = this.editor.getDocument();
+        // viewBox Sync
+        this.unregisters.push(this.editor.registerSync('viewBox', (val) => {
+            if (val) {
+                svg.setAttribute('viewBox', val);
+            }
+            else {
+                svg.removeAttribute('viewBox');
+            }
+        }, { immediate: true }));
+        // padding Sync
+        this.unregisters.push(this.editor.registerSync('padding', (val) => {
+            if (val !== undefined)
+                (0, utils_1.setSVGPadding)(svg, (0, utils_1.parsePadding)(val));
+        }, { immediate: true }));
+    }
+    destroy() {
+        this.unregisters.forEach((fn) => fn());
+    }
+}
+exports.CoreSyncPlugin = CoreSyncPlugin;

package/lib/editor/plugins/edit-bar/edit-items/align-elements.js

@@ -5,7 +5,7 @@ const jsx_1 = require("../../../../jsx");
 const utils_1 = require("../../../../utils");
 const commands_1 = require("../../../commands");
 const utils_2 = require("../../../utils");
-const components_1 = require("../components");
+const components_1 = require("../../components");
 const GRID_CLASS = 'infographic-align-grid';
 const GRID_COMPACT_CLASS = `${GRID_CLASS}--compact`;
 const GRID_STYLE_ID = 'infographic-align-grid-style';

package/lib/editor/plugins/edit-bar/edit-items/font-align.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.FontAlign = void 0;
 const utils_1 = require("../../../../utils");
 const commands_1 = require("../../../commands");
-const components_1 = require("../components");
+const components_1 = require("../../components");
 // 常量定义
 const GRID_CLASS = 'infographic-font-align-grid';
 const GRID_STYLE_ID = 'infographic-font-align-grid-style';

package/lib/editor/plugins/edit-bar/edit-items/font-color.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.FontColor = void 0;
 const utils_1 = require("../../../../utils");
 const commands_1 = require("../../../commands");
-const components_1 = require("../components");
+const components_1 = require("../../components");
 const FONT_COLOR_BUTTON_CLASS = 'infographic-font-color-btn';
 const FONT_COLOR_STYLE_ID = 'infographic-font-color-style';
 const DEFAULT_COLOR = '#1f1f1f';

package/lib/editor/plugins/edit-bar/edit-items/font-family.js

@@ -4,7 +4,7 @@ exports.FontFamily = void 0;
 const renderer_1 = require("../../../../renderer");
 const utils_1 = require("../../../../utils");
 const commands_1 = require("../../../commands");
-const components_1 = require("../components");
+const components_1 = require("../../components");
 const FONT_LIST_CLASS = 'infographic-font-family-list';
 const FONT_OPTION_CLASS = `${FONT_LIST_CLASS}__option`;
 const FONT_LIST_STYLE_ID = 'infographic-font-family-list-style';

package/lib/editor/plugins/edit-bar/edit-items/font-size.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.FontSize = void 0;
 const utils_1 = require("../../../../utils");
 const commands_1 = require("../../../commands");
-const components_1 = require("../components");
+const components_1 = require("../../components");
 const FONT_SIZE_CLASS = 'infographic-font-size-grid';
 const FONT_SIZE_STYLE_ID = 'infographic-font-size-grid-style';
 const FONT_SIZE_OPTIONS = [

package/lib/editor/plugins/edit-bar/edit-items/icon-color.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.IconColor = void 0;
 const utils_1 = require("../../../../utils");
 const commands_1 = require("../../../commands");
-const components_1 = require("../components");
+const components_1 = require("../../components");
 const ICON_COLOR_BUTTON_CLASS = 'infographic-icon-color-btn';
 const ICON_COLOR_STYLE_ID = 'infographic-icon-color-style';
 const DEFAULT_COLOR = '#1f1f1f';

package/lib/editor/plugins/edit-bar/index.d.ts

@@ -1,4 +1,4 @@
-export { ColorPicker, Popover, Select } from './components';
+export { ColorPicker, Popover, Select } from '../components';
 export { EditBar } from './edit-bar';
-export type { ColorPickerHandle, ColorPickerProps, IconButtonHandle, IconButtonProps, IconProps, PopoverHandle, PopoverPlacement, PopoverProps, SelectHandle, SelectOption, SelectProps, SelectValue, } from './components';
+export type { ColorPickerHandle, ColorPickerProps, IconButtonHandle, IconButtonProps, IconProps, PopoverHandle, PopoverPlacement, PopoverProps, SelectHandle, SelectOption, SelectProps, SelectValue, } from '../components';
 export type { EditBarOptions } from './edit-bar';

package/lib/editor/plugins/edit-bar/index.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.EditBar = exports.Select = exports.Popover = exports.ColorPicker = void 0;
-var components_1 = require("./components");
+var components_1 = require("../components");
 Object.defineProperty(exports, "ColorPicker", { enumerable: true, get: function () { return components_1.ColorPicker; } });
 Object.defineProperty(exports, "Popover", { enumerable: true, get: function () { return components_1.Popover; } });
 Object.defineProperty(exports, "Select", { enumerable: true, get: function () { return components_1.Select; } });

package/lib/editor/plugins/index.d.ts

@@ -1,3 +1,5 @@
 export { Plugin } from './base';
+export { CoreSyncPlugin } from './core-sync';
 export * from './edit-bar';
+export { ResetViewBox } from './reset-viewbox';
 export { ResizeElement } from './resize-element';

package/lib/editor/plugins/index.js

@@ -14,9 +14,13 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ResizeElement = exports.Plugin = void 0;
+exports.ResizeElement = exports.ResetViewBox = exports.CoreSyncPlugin = exports.Plugin = void 0;
 var base_1 = require("./base");
 Object.defineProperty(exports, "Plugin", { enumerable: true, get: function () { return base_1.Plugin; } });
+var core_sync_1 = require("./core-sync");
+Object.defineProperty(exports, "CoreSyncPlugin", { enumerable: true, get: function () { return core_sync_1.CoreSyncPlugin; } });
 __exportStar(require("./edit-bar"), exports);
+var reset_viewbox_1 = require("./reset-viewbox");
+Object.defineProperty(exports, "ResetViewBox", { enumerable: true, get: function () { return reset_viewbox_1.ResetViewBox; } });
 var resize_element_1 = require("./resize-element");
 Object.defineProperty(exports, "ResizeElement", { enumerable: true, get: function () { return resize_element_1.ResizeElement; } });

package/lib/editor/plugins/reset-viewbox.d.ts

@@ -0,0 +1,33 @@
+import type { IPlugin, PluginInitOptions } from '../types';
+import { Plugin } from './base';
+export interface ResetViewBoxOptions {
+    style?: Partial<CSSStyleDeclaration>;
+    className?: string;
+    getContainer?: HTMLElement | (() => HTMLElement);
+}
+export declare class ResetViewBox extends Plugin implements IPlugin {
+    private options?;
+    name: string;
+    private originViewBox;
+    private resetButton?;
+    private viewBoxChanged;
+    private unregisterSync?;
+    constructor(options?: ResetViewBoxOptions | undefined);
+    init(options: PluginInitOptions): void;
+    destroy(): void;
+    private handleResize;
+    private updateOriginViewBox;
+    private handleViewBoxChange;
+    protected getOrCreateResetButton: () => HTMLButtonElement;
+    /** Get CSS transform scale of an element */
+    private getTransformScale;
+    /** Find the nearest stable overflow container */
+    private findStableContainer;
+    private placeButton;
+    private updatePosition;
+    private resetViewBox;
+    private showButton;
+    private hideButton;
+    private removeButton;
+    private ensureButtonStyle;
+}