@maqiuyao/dxf-viewer 0.1.0

package/dist/src/dxfViewer/core/camera-controls/Constants.d.ts

@@ -0,0 +1,2 @@
+export declare const PI_2: number;
+export declare const PI_HALF: number;

package/dist/src/dxfViewer/core/camera-controls/EventDispatcher.d.ts

@@ -0,0 +1,42 @@
+export type Listener = (event?: DispatcherEvent) => void;
+export interface DispatcherEvent {
+    type: string;
+    [key: string]: any;
+}
+export declare class EventDispatcher {
+    private _listeners;
+    constructor();
+    /**
+     * Adds the specified event listener.
+     * @param type event name
+     * @param listener handler function
+     * @category Methods
+     */
+    addEventListener(type: string, listener: Listener): void;
+    /**
+     * Presence of the specified event listener.
+     * @param type event name
+     * @param listener handler function
+     * @category Methods
+     */
+    hasEventListener(type: string, listener: Listener): boolean;
+    /**
+     * Removes the specified event listener
+     * @param type event name
+     * @param listener handler function
+     * @category Methods
+     */
+    removeEventListener(type: string, listener: Listener): void;
+    /**
+     * Removes all event listeners
+     * @param type event name
+     * @category Methods
+     */
+    removeAllEventListeners(type?: string): void;
+    /**
+     * Fire an event type.
+     * @param event DispatcherEvent
+     * @category Methods
+     */
+    dispatchEvent(event: DispatcherEvent): void;
+}

package/dist/src/dxfViewer/core/camera-controls/index.d.ts

@@ -0,0 +1,2 @@
+import { CameraControls } from './CameraControls';
+export default CameraControls;

package/dist/src/dxfViewer/core/camera-controls/types.d.ts

@@ -0,0 +1,112 @@
+import type * as _THREE from "three";
+export interface THREESubset {
+    Vector2: typeof _THREE.Vector2;
+    Vector3: typeof _THREE.Vector3;
+    Vector4: typeof _THREE.Vector4;
+    Quaternion: typeof _THREE.Quaternion;
+    Matrix4: typeof _THREE.Matrix4;
+    Spherical: typeof _THREE.Spherical;
+    Box3: typeof _THREE.Box3;
+    Sphere: typeof _THREE.Sphere;
+    Raycaster: typeof _THREE.Raycaster;
+    [key: string]: any;
+}
+export type Ref = {
+    value: number;
+};
+export declare const MOUSE_BUTTON: {
+    LEFT: number;
+    RIGHT: number;
+    MIDDLE: number;
+};
+export type MOUSE_BUTTON = typeof MOUSE_BUTTON[keyof typeof MOUSE_BUTTON];
+export declare const ACTION: Readonly<{
+    NONE: 0;
+    ROTATE: 1;
+    TRUCK: 2;
+    OFFSET: 4;
+    DOLLY: 8;
+    ZOOM: 16;
+    TOUCH_ROTATE: 32;
+    TOUCH_TRUCK: 64;
+    TOUCH_OFFSET: 128;
+    TOUCH_DOLLY: 256;
+    TOUCH_ZOOM: 512;
+    TOUCH_DOLLY_TRUCK: 1024;
+    TOUCH_DOLLY_OFFSET: 2048;
+    TOUCH_DOLLY_ROTATE: 4096;
+    TOUCH_ZOOM_TRUCK: 8192;
+    TOUCH_ZOOM_OFFSET: 16384;
+    TOUCH_ZOOM_ROTATE: 32768;
+}>;
+export type ACTION = number;
+export interface PointerInput {
+    pointerId: number;
+    clientX: number;
+    clientY: number;
+    deltaX: number;
+    deltaY: number;
+    mouseButton: MOUSE_BUTTON | null;
+}
+/**
+ * @internal
+ */
+export type mouseButtonAction = typeof ACTION.ROTATE | typeof ACTION.TRUCK | typeof ACTION.OFFSET | typeof ACTION.DOLLY | typeof ACTION.ZOOM | typeof ACTION.NONE;
+/**
+ * @internal
+ */
+export type mouseWheelAction = typeof ACTION.ROTATE | typeof ACTION.TRUCK | typeof ACTION.OFFSET | typeof ACTION.DOLLY | typeof ACTION.ZOOM | typeof ACTION.NONE;
+/**
+ * @internal
+ */
+export type singleTouchAction = typeof ACTION.TOUCH_ROTATE | typeof ACTION.TOUCH_TRUCK | typeof ACTION.TOUCH_OFFSET | typeof ACTION.DOLLY | typeof ACTION.ZOOM | typeof ACTION.NONE;
+/**
+ * @internal
+ */
+export type multiTouchAction = typeof ACTION.TOUCH_DOLLY_ROTATE | typeof ACTION.TOUCH_DOLLY_TRUCK | typeof ACTION.TOUCH_DOLLY_OFFSET | typeof ACTION.TOUCH_ZOOM_ROTATE | typeof ACTION.TOUCH_ZOOM_TRUCK | typeof ACTION.TOUCH_ZOOM_OFFSET | typeof ACTION.TOUCH_DOLLY | typeof ACTION.TOUCH_ZOOM | typeof ACTION.TOUCH_ROTATE | typeof ACTION.TOUCH_TRUCK | typeof ACTION.TOUCH_OFFSET | typeof ACTION.NONE;
+export interface MouseButtons {
+    left: mouseButtonAction;
+    middle: mouseButtonAction;
+    right: mouseButtonAction;
+    wheel: mouseWheelAction;
+}
+export interface Touches {
+    one: singleTouchAction;
+    two: multiTouchAction;
+    three: multiTouchAction;
+}
+export interface FitToOptions {
+    cover: boolean;
+    paddingLeft: number;
+    paddingRight: number;
+    paddingBottom: number;
+    paddingTop: number;
+}
+export interface CameraControlsEventMap {
+    update: {
+        type: "update";
+    };
+    wake: {
+        type: "wake";
+    };
+    rest: {
+        type: "rest";
+    };
+    sleep: {
+        type: "sleep";
+    };
+    transitionstart: {
+        type: "transitionstart";
+    };
+    controlstart: {
+        type: "controlstart";
+    };
+    control: {
+        type: "control";
+    };
+    controlend: {
+        type: "controlend";
+    };
+}
+export declare function isPerspectiveCamera(camera: _THREE.Camera): camera is _THREE.PerspectiveCamera;
+export declare function isOrthographicCamera(camera: _THREE.Camera): camera is _THREE.OrthographicCamera;

package/dist/src/dxfViewer/core/camera-controls/utils/extractClientCoordFromEvent.d.ts

@@ -0,0 +1,7 @@
+import { PointerInput } from '../types';
+import type * as _THREE from 'three';
+/**
+ * Extract the average client coordinate from the given pointers into `out`.
+ * @internal
+ */
+export declare function extractClientCoordFromEvent(pointers: PointerInput[], out: _THREE.Vector2): void;

package/dist/src/dxfViewer/core/camera-controls/utils/math-utils.d.ts

@@ -0,0 +1,14 @@
+import { Ref } from '../types';
+import type * as _THREE from 'three';
+/**
+ * Degree to radius
+ */
+export declare const Deg2Rad: number;
+export declare function clamp(value: number, min: number, max: number): number;
+export declare function approxZero(number: number, error?: number): boolean;
+export declare function approxEquals(a: number, b: number, error?: number): boolean;
+export declare function roundToStep(value: number, step: number): number;
+export declare function infinityToMaxNumber(value: number): number;
+export declare function maxNumberToInfinity(value: number): number;
+export declare function smoothDamp(current: number, target: number, currentVelocityRef: Ref, smoothTime: number, maxSpeed: number | undefined, deltaTime: number): number;
+export declare function smoothDampVec3(current: _THREE.Vector3, target: _THREE.Vector3, currentVelocityRef: _THREE.Vector3, smoothTime: number, maxSpeed: number | undefined, deltaTime: number, out: _THREE.Vector3): _THREE.Vector3;

package/dist/src/dxfViewer/core/camera-controls/utils/notSupportedInOrthographicCamera.d.ts

@@ -0,0 +1,2 @@
+import * as _THREE from 'three';
+export declare function notSupportedInOrthographicCamera(camera: _THREE.OrthographicCamera | _THREE.PerspectiveCamera, message: string): camera is _THREE.OrthographicCamera;

package/dist/src/dxfViewer/core/canvas/CanvasRender.d.ts

@@ -0,0 +1,49 @@
+import { DrawableData } from './Constants';
+import { Drawable } from './Drawable';
+import { DrawableList } from './DrawableList';
+import { Event } from '../utils';
+import { BaseViewer } from '../viewers';
+import * as THREE from "three";
+/**
+ * @internal
+ */
+export type constructorReturnType<T> = new (...arg: any) => T;
+/**
+ * @internal
+ */
+export declare class CanvasRender extends Event {
+    private viewer;
+    private drawableLists;
+    private canvas?;
+    context?: CanvasRenderingContext2D;
+    private frustum;
+    private projScreenMatrix;
+    static _registerDrawableClass(drawable: constructorReturnType<Drawable>): void;
+    static createDrawable(data: DrawableData): Drawable<Record<string, unknown>>;
+    constructor(viewer: BaseViewer);
+    get is3d(): boolean;
+    get container(): HTMLElement;
+    get camera(): THREE.Camera;
+    get raycaster(): THREE.Raycaster;
+    private init;
+    private initCanvas;
+    private toHighDpr;
+    clearCanvas(): void;
+    addDrawableList(drawableList: DrawableList): void;
+    render(): void;
+    setSize(width: number, height: number): void;
+    getSortedDrawables(onlyVisible?: boolean): Drawable<Record<string, unknown>>[];
+    getDrawablesByDrawableListAndPosition(drawList: DrawableList, p: THREE.Vector3): Drawable<Record<string, unknown>> | undefined;
+    getDrawablesByPosition(p: THREE.Vector3): Drawable[];
+    getDrawableById(id: string): Drawable<Record<string, unknown>> | undefined;
+    measureTextLength(text: string, font: string): number;
+    /**
+     *
+     * @param option
+     * @returns
+     * @deprecated
+     */
+    getImage(filter: (drawable: Drawable) => boolean): Promise<HTMLImageElement>;
+    getCanvas(): HTMLCanvasElement | undefined;
+    destroy(): void;
+}

package/dist/src/dxfViewer/core/canvas/Constants.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Drawable data, including measurement data, markup data, etc.
+ */
+export interface DrawableData {
+    /**
+     * id is used by business logic to manage(find, update, delete, etc.) drawables
+     */
+    id: string;
+    /**
+     * Two dimension float array stores 2d or 3d points.
+     * e.g., You can use "[[1, 1], [2.5, 3]]" to represent a distance measurement result,
+     * "[1, 1]" is the first point, and "[2.5, 3]" is the second point.
+     */
+    points: number[][];
+    lineWidth?: number;
+    /**
+     * Line color is number array. e.g: [r, g, b, a]
+     */
+    lineColor?: number[];
+    /**
+     * Fill color is number array. e.g: [r, g, b, a]
+     */
+    fillColor?: number[];
+    /**
+     * Drawable dta type
+     */
+    type: string;
+}

package/dist/src/dxfViewer/core/canvas/Drawable.d.ts

@@ -0,0 +1,87 @@
+import { DrawableData } from './Constants';
+import { Event } from '../utils';
+import * as THREE from "three";
+/**
+ * @internal
+ */
+export declare abstract class Drawable<DrawableEvents extends Record<string, unknown> = Record<string, unknown>> extends Event<DrawableEvents> {
+    protected readonly DEFAULT_LINE_WIDTH = 1;
+    protected readonly DEFAULT_STROKE_STYLE: number[];
+    protected readonly DEFAULT_FILL_STYLE: number[];
+    id: string;
+    protected lineWidth: number;
+    protected lineColor: number[];
+    protected fillColor: number[];
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    protected points: THREE.Vector3[];
+    userData: Record<any, any>;
+    protected tolerance: number;
+    visible: boolean;
+    selected: boolean;
+    /**
+     * render order, the bigger number is on the top
+     */
+    renderOrder: number;
+    needsFrustumCulled: boolean;
+    protected editPointSize: number;
+    protected editPointFillColor: string;
+    protected editPointStrokeColor: string;
+    protected matrix: THREE.Matrix4;
+    protected ctx?: CanvasRenderingContext2D;
+    constructor(id?: string);
+    setTolerance(t: number): void;
+    render(ctx: CanvasRenderingContext2D, camera: THREE.Camera): void;
+    getData(): DrawableData;
+    setData(data: DrawableData): void;
+    getVertexes(): THREE.Vector3[];
+    setLineWidth(lineWidth?: number): void;
+    setLineColor(color?: number[]): void;
+    setFillColor(color?: number[]): void;
+    isSelected(): boolean;
+    getCenter(): THREE.Vector3;
+    transToScreenCoord(vector: THREE.Vector3, camera: THREE.Camera): THREE.Vector2;
+    /**
+     *
+     * @param ctx
+     * @param camera
+     * @describe just for debug bounds
+     */
+    private drawBounds;
+    /**
+     *
+     * @param ctx
+     * @param camera
+     * @describe just for debug
+     */
+    private drawCenter;
+    /**
+     *
+     * @param p is world position
+     * @param raycaster just for 3d intersect
+     * @returns boolean
+     * @describe is point interact drawable, use to select drawable, the same as threejs object raycast
+     */
+    abstract isPointInPath(p: THREE.Vector3, raycaster?: THREE.Raycaster): boolean;
+    getBounds(): THREE.Box3;
+    /**
+     *
+     * @param ctx
+     * @param camera
+     * @describe abstract draw method
+     */
+    abstract draw(ctx: CanvasRenderingContext2D, camera: THREE.Camera): void;
+    /**
+     *
+     * @param ctx
+     * @param camera
+     * @describe abstract drawSelect method
+     */
+    abstract drawSelect(ctx: CanvasRenderingContext2D, camera: THREE.Camera): void;
+    /**
+     * @describe class type for serialize
+     */
+    abstract getClassType(): string;
+}

package/dist/src/dxfViewer/core/canvas/DrawableList.d.ts

@@ -0,0 +1,40 @@
+import { DrawableData } from './Constants';
+import { Drawable } from './Drawable';
+import { Event } from '../utils';
+import * as THREE from "three";
+/**
+ * Drawable list events.
+ */
+type DrawableListEvents = {
+    /**
+     * Triggerd when a drawable is added.
+     */
+    add: DrawableData;
+    /**
+     * Triggerd when a drawable is updated.
+     */
+    update: DrawableData;
+    /**
+     * Triggerd when a drawable is removed.
+     */
+    remove: DrawableData;
+};
+/**
+ * A group of Drawlables for a certain category
+ * @internal
+ */
+export declare class DrawableList extends Event<DrawableListEvents> {
+    private category;
+    private drawableMap;
+    constructor(category: string);
+    addDrawable(drawable: Drawable): void;
+    updateDrawable(drawable: Drawable, newData: DrawableData): void;
+    removeDrawable(drawable: Drawable): void;
+    getDrawableById(id: string): Drawable | undefined;
+    clear(): void;
+    getDrawables(): Map<string, Drawable>;
+    getDrawableDatas(): DrawableData[];
+    setDrawableDatas(drawableDatas: DrawableData[]): void;
+    getDrawableByPosition(p: THREE.Vector3, raycaster?: THREE.Raycaster): Drawable | undefined;
+}
+export {};

package/dist/src/dxfViewer/core/canvas/index.d.ts

@@ -0,0 +1,4 @@
+export * from './CanvasRender';
+export * from './DrawableList';
+export * from './Drawable';
+export * from './Constants';

package/dist/src/dxfViewer/core/compare/BaseDxfCompareHelper.d.ts

@@ -0,0 +1,104 @@
+import { ProgressBar } from '../components';
+import { DxfCompareConfig, Model2dConfig, Viewer2dConfig } from '../Configs';
+import { DxfChange, DxfLoader } from '../dxf';
+import { FontManager } from '../font';
+import { Viewer2d } from '../viewers/Viewer2d';
+import * as THREE from "three";
+/**
+ * Dxf compare helper with one viewport.
+ * @example
+ * ``` html
+ * <div id="app">
+ *     <div id="myCanvas" style="width: 100%; height: 100%; display: inline-block;"></div>
+ * </div>
+ * ```
+ * ``` typescript
+ * const viewerCfg = { containerId: "myCanvas" };
+ * const modelCfg1 = { modelId: "id_1", src: "http://www.abc.com/sample1.dxf" };
+ * const modelCfg2 = { modelId: "id_2", src: "http://www.abc.com/sample2.dxf" };
+ * const fontFiles = ["http://www.abc.com/hztxt.shx", "http://www.abc.com/simplex.shx"];
+ *
+ * const compareHelper = new BaseDxfCompareHelper(viewerCfg);
+ * await compareHelper.setFont(fontFiles);
+ * await compareHelper.compare(modelCfg1, modelCfg2);
+ * ```
+ */
+export declare class BaseDxfCompareHelper {
+    /**
+     * Viewer2d of DxfCompareHelper.
+     */
+    viewer: Viewer2d;
+    protected fontManager?: FontManager;
+    protected loader: DxfLoader;
+    protected loadingManager?: THREE.LoadingManager;
+    protected changes?: Record<string, DxfChange>;
+    protected container: HTMLElement;
+    protected spinner?: HTMLDivElement;
+    protected jobCount: number;
+    protected loadingProgressBar?: ProgressBar;
+    constructor(viewerCfg: Viewer2dConfig);
+    protected initSpinner(): void;
+    /**
+     * @description {en} Sets font.
+     * This needs to be called before loading a dxf, it won't affect any loaded text.
+     * It accepts shx or typeface formats. For typeface, it only support passing in 1 font file in the array for now.
+     * @description {zh} 设置字体。
+     * 需要在加载dxf之前调用，不会影响已加载的文字。
+     * 支持shx或typeface格式。对于typeface，目前只支持传入1个字体文件。
+     * @param urls
+     * - {en} font file urls.
+     * - {zh} 字体文件链接。
+     * @example
+     * ```typescript
+     * compareHelper.setFont(["https://example.com/xxx.shx"]);
+     * ```
+     */
+    setFont(urls: string[]): Promise<void>;
+    /**
+     * Compares two dxf files. Note that:
+     * - It only compares model spaces.
+     * - It shouldn't load anything else before and after compare.
+     * @param modelCfg1 The first dxf to be compared
+     * @param modelCfg2 The second dxf to be compared
+     * @param onProgress loading progress
+     */
+    compare(modelCfg1: Model2dConfig, modelCfg2: Model2dConfig, compareCfg?: DxfCompareConfig, onProgress?: (event: ProgressEvent) => void): Promise<void>;
+    /**
+     * @description {en} Gets compare changes.
+     * @description {zh} 获取对比变动.
+     * @returns
+     * - {en} Compare changes.
+     * - {zh} 对比变动列表。
+     * @example
+     * ``` typescript
+     * const changes = compareHelper.getChanges();
+     * console.log(changes);
+     * ```
+     */
+    getChanges(): Record<number, DxfChange> | undefined;
+    /**
+     * @description {en} Zooms to a compare change.
+     * @description {zh} 聚焦到图纸的一处变动。
+     * @param changeId
+     * - {en} Change id, which is an incremental integer starts from 1.
+     * - {zh} 变动id，该id是从数字1开始自增的整数。
+     * @example
+     * ``` typescript
+     * const changeId = 1;
+     * compareHelper.zoomToChange(changeId);
+     * ```
+     */
+    zoomToChange(changeId: number): void;
+    /**
+     * Sets spinner visibility
+     */
+    protected setSpinnerVisibility(visible: boolean): void;
+    /**
+     * Increases job count, and show spinner accordingly
+     */
+    protected increaseJobCount(): void;
+    /**
+     * Decreases job count, and hide spinner accordingly
+     */
+    protected decreaseJobCount(): void;
+}

package/dist/src/dxfViewer/core/compare/CompareDrawable.d.ts

@@ -0,0 +1,30 @@
+import { Drawable } from '../canvas';
+import * as THREE from "three";
+/**
+ * @internal
+ */
+export declare class CompareDrawable extends Drawable {
+    boxes: THREE.Box3[];
+    lineSegments: THREE.Vector3[][];
+    /**
+     * @param id
+     * @param boxes 需要绘制云线框的包围盒集合
+     * @param lineColor 边框颜色 rgba 数组（0~1），默认红色
+     * @param fillColor 区域半透明填充色 rgba 数组（0~1），默认与边框同色、低透明度
+     */
+    constructor(id: string, boxes: THREE.Box3[], lineColor?: number[], fillColor?: number[]);
+    /**
+     * 按包围盒尺寸比例向外扩张，使云线框与变动内容之间留出间隙，避免框线压住文字/图形。
+     * 间隙取盒最长边的 12%（退化盒给最小值兜底）。
+     */
+    private static expandBoxesWithGap;
+    private calculateCloudLineSegments;
+    draw(ctx: CanvasRenderingContext2D, camera: THREE.Camera): void;
+    private fillRect;
+    private drawBox;
+    static getControlPointByTwoPoints(p1: THREE.Vector2, p2: THREE.Vector2): THREE.Vector2;
+    drawSelect(ctx: CanvasRenderingContext2D, camera: THREE.Camera): void;
+    isPointInPath(p: THREE.Vector3): boolean;
+    getBounds(): THREE.Box3;
+    getClassType(): string;
+}

package/dist/src/dxfViewer/core/compare/DxfCompareHelper.d.ts

@@ -0,0 +1,76 @@
+import { DxfCompareConfig, Model2dConfig, Viewer2dConfig } from '../Configs';
+import { Viewer2d } from '../viewers/Viewer2d';
+import { BaseDxfCompareHelper } from './BaseDxfCompareHelper';
+/**
+ * Dxf compare helper with two viewports.
+ * @example
+ * ``` html
+ * <div id="app">
+ *     <div id="myCanvas1" style="width: 50%; height: 100%; display: inline-block;"></div>
+ *     <div id="myCanvas2" style="width: 50%; height: 100%; display: inline-block; padding-left: 1px;"></div>
+ * </div>
+ * ```
+ * ``` typescript
+ * const viewerCfg1 = { containerId: "myCanvas1" };
+ * const viewerCfg2 = { containerId: "myCanvas2" };
+ * const modelCfg1 = { modelId: "id_1", src: "http://www.abc.com/sample1.dxf" };
+ * const modelCfg2 = { modelId: "id_2", src: "http://www.abc.com/sample2.dxf" };
+ * const fontFiles = ["http://www.abc.com/hztxt.shx", "http://www.abc.com/simplex.shx"];
+ *
+ * const compareHelper = new DxfCompareHelper(viewerCfg1, viewerCfg2);
+ * await compareHelper.setFont(fontFiles);
+ * await compareHelper.compare(modelCfg1, modelCfg2);
+ * compareHelper.enableSyncCamera(true);
+ * ```
+ */
+export declare class DxfCompareHelper extends BaseDxfCompareHelper {
+    /**
+     * The second Viewer2d of DxfCompareHelper.
+     */
+    viewer2: Viewer2d;
+    /**
+     * Enables to synchronize camera position when another camera is moved.
+     */
+    protected syncCamera: boolean;
+    private markupManager1?;
+    private markupManager2?;
+    constructor(viewerCfg1: Viewer2dConfig, viewerCfg2: Viewer2dConfig);
+    protected initSyncCameraEvent(): void;
+    /**
+     * @description {en} Enables to synchronize camera position when another camera is moved.
+     * @description {zh} 设置开启或关闭同步相机视角。
+     * @example
+     * ```typescript
+     * compareHelper.enableSyncCamera(true);
+     * ```
+     */
+    enableSyncCamera(enable: boolean): void;
+    private syncCameraControls;
+    /**
+     * Compares two dxf files. Note that:
+     * - It only compares model spaces.
+     * - It shouldn't load anything else before and after compare.
+     * @param modelCfg1 The first dxf to be compared
+     * @param modelCfg2 The second dxf to be compared
+     * @param onProgress loading progress
+     */
+    compare(modelCfg1: Model2dConfig, modelCfg2: Model2dConfig, compareCfg?: DxfCompareConfig, onProgress?: (event: ProgressEvent) => void): Promise<void>;
+    /**
+     * 在左右两个视口上绘制变动区域的云线框（按新增/删除/修改着色）。
+     * 延迟到下一帧执行，确保模型已加入场景、overlay 尺寸已就绪。
+     */
+    private drawCompareBoxes;
+    /**
+     * @description {en} Zooms to a compare change.
+     * @description {zh} 聚焦到图纸的一处变动。
+     * @param changeId
+     * - {en} Change id, which is an incremental integer starts from 1.
+     * - {zh} 变动id，该id是从数字1开始自增的整数。
+     * @example
+     * ``` typescript
+     * const changeId = 1;
+     * compareHelper.zoomToChange(changeId);
+     * ```
+     */
+    zoomToChange(changeId: number): void;
+}

package/dist/src/dxfViewer/core/compare/DxfCompareMarkupManager.d.ts

@@ -0,0 +1,11 @@
+import { Viewer2d } from '../viewers';
+import { DxfChange } from '../dxf';
+import { Event } from '../utils';
+export declare class DxfCompareMarkupManager extends Event {
+    private viewer;
+    private overlayRender?;
+    private drawableList;
+    constructor(viewer: Viewer2d);
+    drawCompareDrawable(changes: Record<string, DxfChange>): void;
+    setCompareDrawableVisible(visilbe: boolean): void;
+}

package/dist/src/dxfViewer/core/compare/index.d.ts

@@ -0,0 +1,4 @@
+export * from './CompareDrawable';
+export * from './DxfCompareMarkupManager';
+export * from './DxfCompareHelper';
+export * from './BaseDxfCompareHelper';

package/dist/src/dxfViewer/core/components/Container.d.ts

@@ -0,0 +1,38 @@
+export declare class Container {
+    width: number;
+    height: number;
+    /**
+     * The root container which will be created to under the container user passed in,
+     * it typically contains a viewer container and a widget container.
+     */
+    container: HTMLDivElement;
+    /**
+     * The viewer container, which contains
+     * - canvas of three.js
+     * - canvas for overlay renderer
+     * - css2d object renderer
+     */
+    viewerContainer?: HTMLDivElement;
+    /**
+     * The vidget container, may contain:
+     * - Axis gizmo
+     * - Progress bar
+     * - Toolbar ui
+     * - Context menu
+     */
+    widgetContainer?: HTMLDivElement;
+    constructor(containerId: string);
+    /**
+     * Creates a viewerContainer under the container that user passed in.
+     * There are some benefits to create a new one. e.g., its style won't affect
+     * the container div user passed in.
+     */
+    private initViewerContainer;
+    /**
+     *
+     * @description Create a div for ui widget, if widget need position, just relative container, maybe remove later.
+     */
+    private initWidgetContainer;
+    get needResize(): boolean;
+    destroy(): void;
+}