@inweb/client 25.3.8 → 25.3.10

package/dist/client.js

@@ -1555,342 +1555,183 @@
     }
 
     ///////////////////////////////////////////////////////////////////////////////
-    // Copyright (C) 2002-2021, Open Design Alliance (the "Alliance").
-    // All rights reserved.
-    //
-    // This software and its documentation and related materials are owned by
-    // the Alliance. The software may only be incorporated into application
-    // programs owned by members of the Alliance, subject to a signed
-    // Membership Agreement and Supplemental Software License Agreement with the
-    // Alliance. The structure and organization of this software are the valuable
-    // trade secrets of the Alliance and its suppliers. The software is also
-    // protected by copyright law and international treaty provisions. Application
-    // programs incorporating this software must include the following statement
-    // with their copyright notices:
-    //
-    //   This application incorporates Open Design Alliance software pursuant to a
-    //   license agreement with Open Design Alliance.
-    //   Open Design Alliance Copyright (C) 2002-2021 by Open Design Alliance.
-    //   All rights reserved.
-    //
-    // By use of this software, its documentation or related materials, you
-    // acknowledge and accept the above terms.
-    ///////////////////////////////////////////////////////////////////////////////
-    class Options {
-        constructor(emitter) {
-            this._emitter = emitter;
-            this._data = Options.defaults();
-            this.loadFromStorage();
-        }
-        static defaults() {
-            return {
-                showWCS: true,
-                cameraAnimation: true,
-                antialiasing: true,
-                groundShadow: false,
-                shadows: false,
-                cameraAxisXSpeed: 4,
-                cameraAxisYSpeed: 1,
-                ambientOcclusion: false,
-                enableStreamingMode: true,
-                enablePartialMode: false,
-                memoryLimit: 3294967296,
-                cuttingPlaneFillColor: { red: 0xff, green: 0x98, blue: 0x00 },
-                edgesColor: { r: 0xff, g: 0x98, b: 0x00 },
-                facesColor: { r: 0xff, g: 0x98, b: 0x00 },
-                edgesVisibility: true,
-                edgesOverlap: true,
-                facesOverlap: false,
-                facesTransparancy: 200,
-                enableCustomHighlight: true,
-                sceneGraph: false,
-                edgeModel: true,
-                reverseZoomWheel: false,
-                enableZoomWheel: true,
-                enableGestures: true,
-                geometryType: "vsfx",
-            };
+    /**
+     * A permission provides information about {@link File | file} sharing granted to a specific
+     * {@link User | users}, group, or project {@link Member | member}.
+     */
+    class Permission {
+        /**
+         * @param data - An object that implements permission data storage.
+         * @param fileId - Owner file ID.
+         * @param httpClient - Http client.
+         */
+        constructor(data, fileId, httpClient) {
+            this.httpClient = httpClient;
+            this.fileId = fileId;
+            this.data = data;
         }
-        notifierChangeEvent() {
-            if (this._emitter !== undefined) {
-                this.saveToStorage();
-                this._emitter.emit({ type: "optionschange", data: this });
-            }
+        internalGet() {
+            return this.httpClient.get(`/files/${this.fileId}/permissions/${this.id}`);
         }
-        saveToStorage() {
-            if (typeof window !== "undefined")
-                try {
-                    localStorage.setItem("od-client-settings", JSON.stringify(this.data));
-                }
-                catch (error) {
-                    console.error("Cannot save client settings.", error);
-                }
+        internalPut(body) {
+            return this.httpClient.put(`/files/${this.fileId}/permissions/${this.id}`, body);
         }
-        loadFromStorage() {
-            if (typeof window !== "undefined")
-                try {
-                    const item = localStorage.getItem("od-client-settings");
-                    if (item) {
-                        const data = JSON.parse(item);
-                        this.data = { ...data };
-                    }
-                }
-                catch (error) {
-                    console.error("Cannot load client settings.", error);
-                }
+        internalDelete() {
+            return this.httpClient.delete(`/files/${this.fileId}/permissions/${this.id}`);
         }
         /**
-         * Reset options to default
+         * Defines what actions are allowed to be performed on a file with this permission:
          *
-         * @param fields - Name of fields to be reset
+         * - `read` - The ability to read file description, geometry data and properties
+         * - `readSourceFile` - The ability to read source file
+         * - `write` - The ability to modify file name, description and references
+         * - `readViewpoint` - The ability to read file viewpoints
+         * - `createViewpoint` - The ability to create file viewpoints
          */
-        resetToDefaults(fields) {
-            if (fields !== undefined) {
-                const defaults = Options.defaults();
-                const resetData = fields.reduce((acc, field) => {
-                    acc[field] = defaults[field];
-                    return acc;
-                }, {});
-                this.data = { ...this.data, ...resetData };
-            }
-            else {
-                this.data = { ...this.data, ...Options.defaults() };
-            }
+        get actions() {
+            return this.data.actions;
+        }
+        set actions(value) {
+            this._data.actions = value;
         }
+        /**
+         * Raw permission data received from the server.
+         *
+         * @readonly
+         */
         get data() {
             return this._data;
         }
         set data(value) {
-            const sceneGraph = value.enablePartialMode ? false : value.sceneGraph;
-            this._data = { ...Options.defaults(), ...this._data, ...value, sceneGraph };
-            this.notifierChangeEvent();
+            this._data = value;
         }
-        get showWCS() {
-            return this._data.showWCS;
+        /**
+         * Unique permission ID.
+         *
+         * @readonly
+         */
+        get id() {
+            return this.data.id;
         }
-        set showWCS(value) {
-            this._data.showWCS = value;
-            this.notifierChangeEvent();
+        /**
+         * Principials are any entity that can be authenticated by the server, such as a any user or
+         * project that will get access to the file.
+         *
+         * @typedef {any} Principial
+         * @property {any} user - The user entry that get access to the file.
+         * @property {string} user.id - User ID.
+         * @property {string} user.name - User name.
+         * @property {any} project - The project entry that get access to the file.
+         * @property {string} project.id - Project ID.
+         * @property {string} project.name - Project name.
+         */
+        /**
+         * A collection of principials that will get access to the file.
+         */
+        get grantedTo() {
+            return this.data.grantedTo;
         }
-        get cameraAnimation() {
-            return this._data.cameraAnimation;
+        set grantedTo(value) {
+            this.data.grantedTo = value;
         }
-        set cameraAnimation(value) {
-            this._data.cameraAnimation = value;
-            this.notifierChangeEvent();
+        /**
+         * Specifies whether all users have access to the file or not.
+         */
+        get public() {
+            return this.data.public;
         }
-        get antialiasing() {
-            return this._data.antialiasing;
+        set public(value) {
+            this.data.public = value;
         }
-        set antialiasing(value) {
-            this._data.antialiasing = value;
-            this.notifierChangeEvent();
+        /**
+         * Refresh permission data.
+         *
+         * @async
+         */
+        async checkout() {
+            this.data = await json(this.internalGet());
+            return this;
         }
-        get groundShadow() {
-            return this._data.groundShadow;
+        /**
+         * Update permission data on the server.
+         *
+         * @async
+         * @param data - Raw permission data.
+         */
+        async update(data) {
+            this.data = await json(this.internalPut(data));
+            return this;
         }
-        set groundShadow(value) {
-            this._data.groundShadow = value;
-            this.notifierChangeEvent();
+        /**
+         * Remove a permission from a file.
+         *
+         * @async
+         * @returns Returns the raw data of a deleted permission.
+         */
+        delete() {
+            return json(this.internalDelete());
         }
-        get shadows() {
-            return this._data.shadows;
+        /**
+         * Save permission data changes to the server. Call this method to update permission data on
+         * the server after any changes.
+         *
+         * @async
+         */
+        save() {
+            return this.update(this.data);
         }
-        set shadows(value) {
-            this._data.shadows = value;
-            this.notifierChangeEvent();
+    }
+
+    ///////////////////////////////////////////////////////////////////////////////
+    /**
+     * The class representing a `job` entity describes the process of converting a file from one
+     * format to another, to obtain geometric data, validate the file, or run a clash test.
+     */
+    class Job {
+        /**
+         * @param data - An object that implements job data storage.
+         * @param httpClient - Http client.
+         */
+        constructor(data, httpClient) {
+            this.httpClient = httpClient;
+            this.data = data;
         }
-        get cameraAxisXSpeed() {
-            return this._data.cameraAxisXSpeed;
+        internalGet() {
+            return this.httpClient.get(`/jobs/${this.data.id}`);
         }
-        set cameraAxisXSpeed(value) {
-            this._data.cameraAxisXSpeed = value;
-            this.notifierChangeEvent();
+        internalPut(body) {
+            return this.httpClient.put(`/jobs/${this.data.id}`, body);
         }
-        get cameraAxisYSpeed() {
-            return this._data.cameraAxisYSpeed;
+        internalDelete() {
+            return this.httpClient.delete(`/jobs/${this.data.id}`);
         }
-        set cameraAxisYSpeed(value) {
-            this.cameraAxisYSpeed = value;
-            this.notifierChangeEvent();
-        }
-        get ambientOcclusion() {
-            return this._data.ambientOcclusion;
-        }
-        set ambientOcclusion(value) {
-            this._data.ambientOcclusion = value;
-            this.notifierChangeEvent();
-        }
-        get enableStreamingMode() {
-            return this._data.enableStreamingMode;
-        }
-        set enableStreamingMode(value) {
-            this._data.enableStreamingMode = value;
-            if (this._data.enableStreamingMode) {
-                this._data.enablePartialMode = false;
-            }
-            this.notifierChangeEvent();
-        }
-        get enablePartialMode() {
-            return this._data.enablePartialMode;
-        }
-        set enablePartialMode(value) {
-            this._data.enablePartialMode = value;
-            if (value)
-                this._data.sceneGraph = false;
-            this.notifierChangeEvent();
-        }
-        get memoryLimit() {
-            return this._data.memoryLimit;
-        }
-        set memoryLimit(value) {
-            this._data.memoryLimit = value;
-            this.notifierChangeEvent();
-        }
-        get cuttingPlaneFillColor() {
-            return this._data.cuttingPlaneFillColor;
-        }
-        set cuttingPlaneFillColor(value) {
-            this._data.cuttingPlaneFillColor = value;
-            this.notifierChangeEvent();
-        }
-        get edgesColor() {
-            return this._data.edgesColor;
-        }
-        set edgesColor(value) {
-            this._data.edgesColor = value;
-            this.notifierChangeEvent();
-        }
-        get facesColor() {
-            return this._data.facesColor;
-        }
-        set facesColor(value) {
-            this._data.facesColor = value;
-            this.notifierChangeEvent();
-        }
-        get edgesVisibility() {
-            return this._data.edgesVisibility;
-        }
-        set edgesVisibility(value) {
-            this._data.edgesVisibility = value;
-            this.notifierChangeEvent();
-        }
-        get edgesOverlap() {
-            return this._data.edgesOverlap;
-        }
-        set edgesOverlap(value) {
-            this._data.edgesOverlap = value;
-            this.notifierChangeEvent();
-        }
-        get facesOverlap() {
-            return this._data.facesOverlap;
-        }
-        set facesOverlap(value) {
-            this._data.facesOverlap = value;
-            this.notifierChangeEvent();
-        }
-        get facesTransparancy() {
-            return this._data.facesTransparancy;
-        }
-        set facesTransparancy(value) {
-            this._data.facesTransparancy = value;
-            this.notifierChangeEvent();
-        }
-        get enableCustomHighlight() {
-            return this._data.enableCustomHighlight;
-        }
-        set enableCustomHighlight(value) {
-            this._data.enableCustomHighlight = value;
-            this.notifierChangeEvent();
-        }
-        get sceneGraph() {
-            return this._data.sceneGraph;
-        }
-        set sceneGraph(value) {
-            this._data.sceneGraph = value;
-            if (value)
-                this._data.enablePartialMode = false;
-            this.notifierChangeEvent();
-        }
-        get edgeModel() {
-            return Boolean(this._data.edgeModel);
-        }
-        set edgeModel(value) {
-            this._data.edgeModel = Boolean(value);
-            this.notifierChangeEvent();
-        }
-        get reverseZoomWheel() {
-            return this._data.reverseZoomWheel;
-        }
-        set reverseZoomWheel(value) {
-            this._data.reverseZoomWheel = !!value;
-            this.notifierChangeEvent();
-        }
-        get enableZoomWheel() {
-            return this._data.enableZoomWheel;
-        }
-        set enableZoomWheel(value) {
-            this._data.enableZoomWheel = !!value;
-            this.notifierChangeEvent();
-        }
-        get enableGestures() {
-            return this._data.enableGestures;
-        }
-        set enableGestures(value) {
-            this._data.enableGestures = !!value;
-            this.notifierChangeEvent();
-        }
-        get geometryType() {
-            return this._data.geometryType;
-        }
-        set geometryType(value) {
-            this._data.geometryType = value;
-            this.notifierChangeEvent();
-        }
-    }
-
-    ///////////////////////////////////////////////////////////////////////////////
-    /**
-     * A permission provides information about {@link File | file} sharing granted to a specific
-     * {@link User | users}, group, or project {@link Member | member}.
-     */
-    class Permission {
         /**
-         * @param data - An object that implements permission data storage.
-         * @param fileId - Owner file ID.
-         * @param httpClient - Http client.
+         * The ID of the assembly the job is working on (internal).
+         *
+         * @readonly
          */
-        constructor(data, fileId, httpClient) {
-            this.httpClient = httpClient;
-            this.fileId = fileId;
-            this.data = data;
-        }
-        internalGet() {
-            return this.httpClient.get(`/files/${this.fileId}/permissions/${this.id}`);
-        }
-        internalPut(body) {
-            return this.httpClient.put(`/files/${this.fileId}/permissions/${this.id}`, body);
-        }
-        internalDelete() {
-            return this.httpClient.delete(`/files/${this.fileId}/permissions/${this.id}`);
+        get assemblyId() {
+            return this.data.assemblyId;
         }
         /**
-         * Defines what actions are allowed to be performed on a file with this permission:
+         * Job creator ID. Use {@link Client#getUser | Client.getUser()} to obtain detailed creator information.
          *
-         * - `read` - The ability to read file description, geometry data and properties
-         * - `readSourceFile` - The ability to read source file
-         * - `write` - The ability to modify file name, description and references
-         * - `readViewpoint` - The ability to read file viewpoints
-         * - `createViewpoint` - The ability to create file viewpoints
+         * @readonly
          */
-        get actions() {
-            return this.data.actions;
+        get authorId() {
+            return this.data.authorId;
         }
-        set actions(value) {
-            this._data.actions = value;
+        /**
+         * Job creation time (UTC) in the format specified in <a
+         * href="https://www.wikipedia.org/wiki/ISO_8601" target="_blank">ISO 8601</a>.
+         *
+         * @readonly
+         */
+        get createdAt() {
+            return this.data.createdAt;
         }
         /**
-         * Raw permission data received from the server.
+         * Raw job data received from the server.
          *
          * @readonly
          */
@@ -1901,190 +1742,54 @@
             this._data = value;
         }
         /**
-         * Unique permission ID.
+         * `true` if job is `done` or `failed`. See {@link Job#status | status} for more details.
          *
          * @readonly
          */
-        get id() {
-            return this.data.id;
+        get done() {
+            return this.data.status === "done" || this.data.status === "failed";
         }
         /**
-         * Principials are any entity that can be authenticated by the server, such as a any user or
-         * project that will get access to the file.
+         * The ID of the file the job is working on.
          *
-         * @typedef {any} Principial
-         * @property {any} user - The user entry that get access to the file.
-         * @property {string} user.id - User ID.
-         * @property {string} user.name - User name.
-         * @property {any} project - The project entry that get access to the file.
-         * @property {string} project.id - Project ID.
-         * @property {string} project.name - Project name.
-         */
-        /**
-         * A collection of principials that will get access to the file.
+         * @readonly
          */
-        get grantedTo() {
-            return this.data.grantedTo;
-        }
-        set grantedTo(value) {
-            this.data.grantedTo = value;
+        get fileId() {
+            return this.data.fileId;
         }
         /**
-         * Specifies whether all users have access to the file or not.
+         * Unique job ID.
+         *
+         * @readonly
          */
-        get public() {
-            return this.data.public;
-        }
-        set public(value) {
-            this.data.public = value;
+        get id() {
+            return this.data.id;
         }
         /**
-         * Refresh permission data.
+         * Job last update (UTC) time in the format specified in <a
+         * href="https://www.wikipedia.org/wiki/ISO_8601" target="_blank">ISO 8601</a>.
          *
-         * @async
+         * @readonly
          */
-        async checkout() {
-            this.data = await json(this.internalGet());
-            return this;
+        get lastUpdate() {
+            return this.data.lastUpdate;
         }
         /**
-         * Update permission data on the server.
+         * Job type. Can be `properties`, `geomerty`, `geomertyGltf`, `validation`, `clash`, `dwg`,
+         * `obj`, `gltf`, `glb`, `vsf`, `pdf` or `3dpdf`.
          *
-         * @async
-         * @param data - Raw permission data.
+         * @readonly
          */
-        async update(data) {
-            this.data = await json(this.internalPut(data));
-            return this;
+        get outputFormat() {
+            return this.data.outputFormat;
         }
         /**
-         * Remove a permission from a file.
+         * Parameters for the job runner.
          *
-         * @async
-         * @returns Returns the raw data of a deleted permission.
+         * @readonly
          */
-        delete() {
-            return json(this.internalDelete());
-        }
-        /**
-         * Save permission data changes to the server. Call this method to update permission data on
-         * the server after any changes.
-         *
-         * @async
-         */
-        save() {
-            return this.update(this.data);
-        }
-    }
-
-    ///////////////////////////////////////////////////////////////////////////////
-    /**
-     * The class representing a `job` entity describes the process of converting a file from one
-     * format to another, to obtain geometric data, validate the file, or run a clash test.
-     */
-    class Job {
-        /**
-         * @param data - An object that implements job data storage.
-         * @param httpClient - Http client.
-         */
-        constructor(data, httpClient) {
-            this.httpClient = httpClient;
-            this.data = data;
-        }
-        internalGet() {
-            return this.httpClient.get(`/jobs/${this.data.id}`);
-        }
-        internalPut(body) {
-            return this.httpClient.put(`/jobs/${this.data.id}`, body);
-        }
-        internalDelete() {
-            return this.httpClient.delete(`/jobs/${this.data.id}`);
-        }
-        /**
-         * The ID of the assembly the job is working on (internal).
-         *
-         * @readonly
-         */
-        get assemblyId() {
-            return this.data.assemblyId;
-        }
-        /**
-         * Job creator ID. Use {@link Client#getUser | Client.getUser()} to obtain detailed creator information.
-         *
-         * @readonly
-         */
-        get authorId() {
-            return this.data.authorId;
-        }
-        /**
-         * Job creation time (UTC) in the format specified in <a
-         * href="https://www.wikipedia.org/wiki/ISO_8601" target="_blank">ISO 8601</a>.
-         *
-         * @readonly
-         */
-        get createdAt() {
-            return this.data.createdAt;
-        }
-        /**
-         * Raw job data received from the server.
-         *
-         * @readonly
-         */
-        get data() {
-            return this._data;
-        }
-        set data(value) {
-            this._data = value;
-        }
-        /**
-         * `true` if job is `done` or `failed`. See {@link Job#status | status} for more details.
-         *
-         * @readonly
-         */
-        get done() {
-            return this.data.status === "done" || this.data.status === "failed";
-        }
-        /**
-         * The ID of the file the job is working on.
-         *
-         * @readonly
-         */
-        get fileId() {
-            return this.data.fileId;
-        }
-        /**
-         * Unique job ID.
-         *
-         * @readonly
-         */
-        get id() {
-            return this.data.id;
-        }
-        /**
-         * Job last update (UTC) time in the format specified in <a
-         * href="https://www.wikipedia.org/wiki/ISO_8601" target="_blank">ISO 8601</a>.
-         *
-         * @readonly
-         */
-        get lastUpdate() {
-            return this.data.lastUpdate;
-        }
-        /**
-         * Job type. Can be `properties`, `geomerty`, `geomertyGltf`, `validation`, `clash`, `dwg`,
-         * `obj`, `gltf`, `glb`, `vsf`, `pdf` or `3dpdf`.
-         *
-         * @readonly
-         */
-        get outputFormat() {
-            return this.data.outputFormat;
-        }
-        /**
-         * Parameters for the job runner.
-         *
-         * @readonly
-         */
-        get parameters() {
-            return this.data.parameters;
+        get parameters() {
+            return this.data.parameters;
         }
         /**
          * Job status. Can be `waiting`, `inprogress`, `done` or `failed`.
@@ -3875,7 +3580,6 @@
             super();
             this.configure(params);
             this.eventEmitter = this;
-            this._options = new Options(this);
             this._user = null;
         }
         /**
@@ -3887,11 +3591,45 @@
             return this._serverUrl;
         }
         /**
-         * `VisualizeJS` parameters. Changes to these parameters are automatically applied to
-         * `Viewer` instances associated with that client.
+         * Deprecated since `25.3`. Use [Viewer.options]{@link Viewer#options} instead to change
+         * Viewer parameters.
          */
         get options() {
-            return this._options;
+            console.warn("Client.options has been deprecated since 25.3 and will be removed in a future release, use Viewer.options instead.");
+            const data = {
+                showWCS: true,
+                cameraAnimation: true,
+                antialiasing: true,
+                groundShadow: false,
+                shadows: false,
+                cameraAxisXSpeed: 4,
+                cameraAxisYSpeed: 1,
+                ambientOcclusion: false,
+                enableStreamingMode: true,
+                enablePartialMode: false,
+                memoryLimit: 3294967296,
+                cuttingPlaneFillColor: { red: 0xff, green: 0x98, blue: 0x00 },
+                edgesColor: { r: 0xff, g: 0x98, b: 0x00 },
+                facesColor: { r: 0xff, g: 0x98, b: 0x00 },
+                edgesVisibility: true,
+                edgesOverlap: true,
+                facesOverlap: false,
+                facesTransparancy: 200,
+                enableCustomHighlight: true,
+                sceneGraph: false,
+                edgeModel: true,
+                reverseZoomWheel: false,
+                enableZoomWheel: true,
+                enableGestures: true,
+            };
+            return {
+                ...data,
+                data,
+                defaults: () => data,
+                resetToDefaults: () => { },
+                saveToStorage: () => { },
+                loadFromStorage: () => { },
+            };
         }
         /**
          * Change the client configuration parameters.
@@ -3925,7 +3663,7 @@
                 .then((data) => ({
                 ...data,
                 server: data.version,
-                client: "25.3.8",
+                client: "25.3.10",
             }));
         }
         /**
@@ -4187,7 +3925,7 @@
          * @param params - An object containing upload parameters.
          * @param params.geometry=true - Create job to extract file geometry data. Can be:
          *
-         *   - `true` - Extract file geometry data into type, defined by [options]{@link Client#options}.
+         *   - `true` - Extract file geometry data into `VSFX` to open the file in `VisualizeJS` viewer.
          *   - `vsfx` - Extract file geometry data into `VSFX` to open the file in `VisualizeJS` viewer.
          *   - `gltf` - Extract file geometry data into `glTF` to open the file in `Three.js` viewer.
          *
@@ -4215,7 +3953,7 @@
             })
                 .then((xhr) => JSON.parse(xhr.responseText))
                 .then((data) => new File$1(data, this._httpClient));
-            const geometryType = typeof params.geometry === "string" ? params.geometry : this.options.geometryType;
+            const geometryType = typeof params.geometry === "string" ? params.geometry : "vsfx";
             const jobs = [];
             if (params.geometry)
                 jobs.push((await result.extractGeometry(geometryType)).outputFormat);
@@ -4691,217 +4429,512 @@
         screenToWorld(x, y) {
             return this.toPoint(this.m_module.getViewer().screenToWorld(x, y));
         }
-        toDoubleArray(points) {
-            const p = [];
-            for (let i = 0; i < points.length; i++) {
-                p.push(points[i].x);
-                p.push(points[i].y);
-                p.push(points[i].z);
-            }
-            return p;
+        toDoubleArray(points) {
+            const p = [];
+            for (let i = 0; i < points.length; i++) {
+                p.push(points[i].x);
+                p.push(points[i].y);
+                p.push(points[i].z);
+            }
+            return p;
+        }
+        correctCameraTarget() {
+            const params = this.getViewParams();
+            const ext = this.m_module.getViewer().getActiveExtents();
+            const { min, max } = ext;
+            const target = this.toPoint(params.target);
+            const contains = target.x >= min.x &&
+                target.y >= min.y &&
+                target.z >= min.z &&
+                target.x <= max.x &&
+                target.y <= max.y &&
+                target.z <= max.z;
+            if (!contains) {
+                params.target = ext.center();
+                this.setViewParams(params);
+            }
+        }
+    }
+
+    ///////////////////////////////////////////////////////////////////////////////
+    const CLICK_DELTA = 5;
+    const INTERACTIVITY_FPS = 24;
+    /**
+     * A [Viewer]{@link Viewer} event that fires when the viewer needs to be updated.
+     *
+     * @property {string} type - `update`
+     * @event update
+     */
+    /**
+     * A [Viewer]{@link Viewer} event that fires when the user selects an entity with the mouse.
+     *
+     * @property {string} type - `select`
+     * @property {OdTvSelectionSet} data - The set of selected entities. For more information, see
+     *   [OdTvSelectionSet](https://cloud.opendesign.com/docs/index.html#/vis/OdTvSelectionSet?id=odtvselectionset).
+     * @event select
+     */
+    class OdBaseDragger extends OdaGeAction {
+        constructor(subject) {
+            super(subject.visualizeJs);
+            this.beginInteractivity = () => {
+                const viewer = this.getViewer();
+                const view = viewer.activeView;
+                if (view["beginInteractivity"]) {
+                    view.beginInteractivity(INTERACTIVITY_FPS);
+                    this.subject.update();
+                }
+                view.delete();
+            };
+            this.endInteractivity = () => {
+                const viewer = this.getViewer();
+                const view = viewer.activeView;
+                if (view["endInteractivity"]) {
+                    view.endInteractivity();
+                    const device = this.getViewer().getActiveDevice();
+                    const canvas = this.m_module.canvas;
+                    device.invalidate([0, 0, canvas.width, canvas.height]);
+                    device.delete();
+                    this.subject.update();
+                }
+                view.delete();
+            };
+            this.subject = subject;
+            this.needInputText = false;
+            this.mouseDownPosition = { x: 0, y: 0 };
+            this.autoSelect = false;
+            this.onmessage = (event) => this.subject.emitEvent(event);
+            this.canvasEvents = CANVAS_EVENTS;
+        }
+        initialize() {
+            this.canvasEvents = this.canvasEvents.filter((x) => typeof this[x] === "function");
+            this.canvasEvents.forEach((x) => (this[x] = this[x].bind(this)));
+            this.canvasEvents.forEach((x) => this.subject.on(x, this[x]));
+            this.getViewer().setEnableAutoSelect(!!this.autoSelect);
+        }
+        dispose() {
+            this.canvasEvents.forEach((x) => this.subject.off(x, this[x]));
+        }
+        relativeCoords(event) {
+            return { x: event.offsetX * window.devicePixelRatio, y: event.offsetY * window.devicePixelRatio };
+        }
+        pointerdown(ev) {
+            if (!ev.isPrimary || OdBaseDragger.isGestureActive) {
+                return;
+            }
+            ev.target.setPointerCapture(ev.pointerId);
+            const relCoord = this.relativeCoords(ev);
+            this.isDragging = true;
+            this.mouseDownPosition = { x: relCoord.x, y: relCoord.y };
+            this.start(relCoord.x, relCoord.y, ev.clientX, ev.clientY);
+            this.subject.update();
+        }
+        pointerup(ev) {
+            if (OdBaseDragger.needSkipPointerUp) {
+                return;
+            }
+            if (!ev.isPrimary) {
+                return;
+            }
+            ev.target.releasePointerCapture(ev.pointerId);
+            const relCoord = this.relativeCoords(ev);
+            this.end(relCoord.x, relCoord.y);
+            this.isDragging = false;
+            this.subject.update();
+        }
+        pointercancel(ev) {
+            if (!ev.isPrimary) {
+                return;
+            }
+            this.m_module.canvas.dispatchEvent(new PointerEvent("pointerup", ev));
+        }
+        pointermove(ev) {
+            if (!ev.isPrimary || OdBaseDragger.isGestureActive) {
+                return;
+            }
+            const relCoord = this.relativeCoords(ev);
+            this.drag(relCoord.x, relCoord.y, ev.movementX, ev.movementY);
+            if (this.isDragging) {
+                this.subject.update();
+            }
+        }
+        click(ev) {
+            const viewer = this.getViewer();
+            const relCoord = this.relativeCoords(ev);
+            const x = relCoord.x;
+            const y = relCoord.y;
+            const isNotDragging = Math.abs(x - this.mouseDownPosition.x) < CLICK_DELTA && Math.abs(y - this.mouseDownPosition.y) < CLICK_DELTA;
+            if (viewer && viewer.getEnableAutoSelect() && isNotDragging) {
+                viewer.unselect();
+                viewer.select(x, y, x, y);
+                this.subject.update();
+                const selectionSet = viewer.getSelected();
+                const handles = this.subject.getSelected();
+                this.onmessage({ type: "select", data: selectionSet, handles });
+            }
+        }
+        dblclick(ev) {
+            const viewer = this.getViewer();
+            const relCoord = this.relativeCoords(ev);
+            const x = relCoord.x;
+            const y = relCoord.y;
+            const device = viewer.getActiveDevice();
+            const clickView = device.viewAt([x, y]);
+            if (clickView && !clickView.active) {
+                viewer.activeView = clickView;
+                clickView.delete();
+                this.subject.update();
+            }
+            else {
+                if (viewer && viewer.getEnableAutoSelect()) {
+                    const pSelected = viewer.getSelected();
+                    if (!pSelected.isNull() && pSelected.numItems() !== 0) {
+                        const itr = pSelected.getIterator();
+                        const entity = itr.getEntity();
+                        viewer.zoomToEntity(entity);
+                        this.onmessage({ type: "zoomtoentity", data: entity });
+                        this.subject.update();
+                        this.deleteAll([itr, entity]);
+                    }
+                }
+            }
+            device.delete();
+        }
+        start(x, y, absoluteX = 0, absoluteY = 0) { }
+        drag(x, y, absoluteX = 0, absoluteY = 0) { }
+        end(x, y) { }
+        getActiveMarkupEntity(entityName) {
+            return this.subject.addMarkupEntity(entityName);
+        }
+        syncOverlayView() {
+            return this.subject.syncOverlay();
+        }
+        deleteAll(objects) {
+            var _a;
+            for (const obj of objects) {
+                (_a = obj === null || obj === void 0 ? void 0 : obj.delete) === null || _a === void 0 ? void 0 : _a.call(obj);
+            }
+        }
+        updatePreview() { }
+        static set isGestureActive(value) {
+            if (OdBaseDragger._isGestureActive === value) {
+                return;
+            }
+            OdBaseDragger._isGestureActive = value;
+            if (OdBaseDragger._isGestureActive) {
+                OdBaseDragger.needSkipPointerUp = true;
+            }
+        }
+        static get isGestureActive() {
+            return OdBaseDragger._isGestureActive;
+        }
+        static get needSkipPointerUp() {
+            if (OdBaseDragger._needSkipPointerUp) {
+                OdBaseDragger.needSkipPointerUp = false;
+                return true;
+            }
+            return false;
+        }
+        static set needSkipPointerUp(value) {
+            OdBaseDragger._needSkipPointerUp = value;
+        }
+    }
+    OdBaseDragger._isGestureActive = false;
+    OdBaseDragger._needSkipPointerUp = false;
+
+    ///////////////////////////////////////////////////////////////////////////////
+    // Copyright (C) 2002-2021, Open Design Alliance (the "Alliance").
+    // All rights reserved.
+    //
+    // This software and its documentation and related materials are owned by
+    // the Alliance. The software may only be incorporated into application
+    // programs owned by members of the Alliance, subject to a signed
+    // Membership Agreement and Supplemental Software License Agreement with the
+    // Alliance. The structure and organization of this software are the valuable
+    // trade secrets of the Alliance and its suppliers. The software is also
+    // protected by copyright law and international treaty provisions. Application
+    // programs incorporating this software must include the following statement
+    // with their copyright notices:
+    //
+    //   This application incorporates Open Design Alliance software pursuant to a
+    //   license agreement with Open Design Alliance.
+    //   Open Design Alliance Copyright (C) 2002-2021 by Open Design Alliance.
+    //   All rights reserved.
+    //
+    // By use of this software, its documentation or related materials, you
+    // acknowledge and accept the above terms.
+    ///////////////////////////////////////////////////////////////////////////////
+    class Options {
+        constructor(emitter) {
+            this._emitter = emitter;
+            this._data = Options.defaults();
+            this.loadFromStorage();
+        }
+        static defaults() {
+            return {
+                showWCS: true,
+                cameraAnimation: true,
+                antialiasing: true,
+                groundShadow: false,
+                shadows: false,
+                cameraAxisXSpeed: 4,
+                cameraAxisYSpeed: 1,
+                ambientOcclusion: false,
+                enableStreamingMode: true,
+                enablePartialMode: false,
+                memoryLimit: 3294967296,
+                cuttingPlaneFillColor: { red: 0xff, green: 0x98, blue: 0x00 },
+                edgesColor: { r: 0xff, g: 0x98, b: 0x00 },
+                facesColor: { r: 0xff, g: 0x98, b: 0x00 },
+                edgesVisibility: true,
+                edgesOverlap: true,
+                facesOverlap: false,
+                facesTransparancy: 200,
+                enableCustomHighlight: true,
+                sceneGraph: false,
+                edgeModel: true,
+                reverseZoomWheel: false,
+                enableZoomWheel: true,
+                enableGestures: true,
+                geometryType: "vsfx",
+            };
+        }
+        notifierChangeEvent() {
+            if (this._emitter !== undefined) {
+                this.saveToStorage();
+                this._emitter.emit({ type: "optionschange", data: this });
+            }
+        }
+        saveToStorage() {
+            if (typeof window !== "undefined")
+                try {
+                    localStorage.setItem("od-client-settings", JSON.stringify(this.data));
+                }
+                catch (error) {
+                    console.error("Cannot save client settings.", error);
+                }
+        }
+        loadFromStorage() {
+            if (typeof window !== "undefined")
+                try {
+                    const item = localStorage.getItem("od-client-settings");
+                    if (item) {
+                        const data = JSON.parse(item);
+                        this.data = { ...data };
+                    }
+                }
+                catch (error) {
+                    console.error("Cannot load client settings.", error);
+                }
+        }
+        /**
+         * Reset options to default
+         *
+         * @param fields - Name of fields to be reset
+         */
+        resetToDefaults(fields) {
+            if (fields !== undefined) {
+                const defaults = Options.defaults();
+                const resetData = fields.reduce((acc, field) => {
+                    acc[field] = defaults[field];
+                    return acc;
+                }, {});
+                this.data = { ...this.data, ...resetData };
+            }
+            else {
+                this.data = { ...this.data, ...Options.defaults() };
+            }
+        }
+        get data() {
+            return this._data;
+        }
+        set data(value) {
+            const sceneGraph = value.enablePartialMode ? false : value.sceneGraph;
+            this._data = { ...Options.defaults(), ...this._data, ...value, sceneGraph };
+            this.notifierChangeEvent();
+        }
+        get showWCS() {
+            return this._data.showWCS;
+        }
+        set showWCS(value) {
+            this._data.showWCS = value;
+            this.notifierChangeEvent();
+        }
+        get cameraAnimation() {
+            return this._data.cameraAnimation;
+        }
+        set cameraAnimation(value) {
+            this._data.cameraAnimation = value;
+            this.notifierChangeEvent();
+        }
+        get antialiasing() {
+            return this._data.antialiasing;
+        }
+        set antialiasing(value) {
+            this._data.antialiasing = value;
+            this.notifierChangeEvent();
+        }
+        get groundShadow() {
+            return this._data.groundShadow;
+        }
+        set groundShadow(value) {
+            this._data.groundShadow = value;
+            this.notifierChangeEvent();
+        }
+        get shadows() {
+            return this._data.shadows;
+        }
+        set shadows(value) {
+            this._data.shadows = value;
+            this.notifierChangeEvent();
+        }
+        get cameraAxisXSpeed() {
+            return this._data.cameraAxisXSpeed;
+        }
+        set cameraAxisXSpeed(value) {
+            this._data.cameraAxisXSpeed = value;
+            this.notifierChangeEvent();
+        }
+        get cameraAxisYSpeed() {
+            return this._data.cameraAxisYSpeed;
+        }
+        set cameraAxisYSpeed(value) {
+            this.cameraAxisYSpeed = value;
+            this.notifierChangeEvent();
+        }
+        get ambientOcclusion() {
+            return this._data.ambientOcclusion;
+        }
+        set ambientOcclusion(value) {
+            this._data.ambientOcclusion = value;
+            this.notifierChangeEvent();
+        }
+        get enableStreamingMode() {
+            return this._data.enableStreamingMode;
+        }
+        set enableStreamingMode(value) {
+            this._data.enableStreamingMode = value;
+            if (this._data.enableStreamingMode) {
+                this._data.enablePartialMode = false;
+            }
+            this.notifierChangeEvent();
+        }
+        get enablePartialMode() {
+            return this._data.enablePartialMode;
+        }
+        set enablePartialMode(value) {
+            this._data.enablePartialMode = value;
+            if (value)
+                this._data.sceneGraph = false;
+            this.notifierChangeEvent();
+        }
+        get memoryLimit() {
+            return this._data.memoryLimit;
+        }
+        set memoryLimit(value) {
+            this._data.memoryLimit = value;
+            this.notifierChangeEvent();
+        }
+        get cuttingPlaneFillColor() {
+            return this._data.cuttingPlaneFillColor;
+        }
+        set cuttingPlaneFillColor(value) {
+            this._data.cuttingPlaneFillColor = value;
+            this.notifierChangeEvent();
+        }
+        get edgesColor() {
+            return this._data.edgesColor;
+        }
+        set edgesColor(value) {
+            this._data.edgesColor = value;
+            this.notifierChangeEvent();
+        }
+        get facesColor() {
+            return this._data.facesColor;
+        }
+        set facesColor(value) {
+            this._data.facesColor = value;
+            this.notifierChangeEvent();
+        }
+        get edgesVisibility() {
+            return this._data.edgesVisibility;
+        }
+        set edgesVisibility(value) {
+            this._data.edgesVisibility = value;
+            this.notifierChangeEvent();
+        }
+        get edgesOverlap() {
+            return this._data.edgesOverlap;
+        }
+        set edgesOverlap(value) {
+            this._data.edgesOverlap = value;
+            this.notifierChangeEvent();
         }
-        correctCameraTarget() {
-            const params = this.getViewParams();
-            const ext = this.m_module.getViewer().getActiveExtents();
-            const { min, max } = ext;
-            const target = this.toPoint(params.target);
-            const contains = target.x >= min.x &&
-                target.y >= min.y &&
-                target.z >= min.z &&
-                target.x <= max.x &&
-                target.y <= max.y &&
-                target.z <= max.z;
-            if (!contains) {
-                params.target = ext.center();
-                this.setViewParams(params);
-            }
+        get facesOverlap() {
+            return this._data.facesOverlap;
         }
-    }
-
-    ///////////////////////////////////////////////////////////////////////////////
-    const CLICK_DELTA = 5;
-    const INTERACTIVITY_FPS = 24;
-    /**
-     * A [Viewer]{@link Viewer} event that fires when the viewer needs to be updated.
-     *
-     * @property {string} type - `update`
-     * @event update
-     */
-    /**
-     * A [Viewer]{@link Viewer} event that fires when the user selects an entity with the mouse.
-     *
-     * @property {string} type - `select`
-     * @property {OdTvSelectionSet} data - The set of selected entities. For more information, see
-     *   [OdTvSelectionSet](https://cloud.opendesign.com/docs/index.html#/vis/OdTvSelectionSet?id=odtvselectionset).
-     * @event select
-     */
-    class OdBaseDragger extends OdaGeAction {
-        constructor(subject) {
-            super(subject.visualizeJs);
-            this.beginInteractivity = () => {
-                const viewer = this.getViewer();
-                const view = viewer.activeView;
-                if (view["beginInteractivity"]) {
-                    view.beginInteractivity(INTERACTIVITY_FPS);
-                    this.subject.update();
-                }
-                view.delete();
-            };
-            this.endInteractivity = () => {
-                const viewer = this.getViewer();
-                const view = viewer.activeView;
-                if (view["endInteractivity"]) {
-                    view.endInteractivity();
-                    const device = this.getViewer().getActiveDevice();
-                    const canvas = this.m_module.canvas;
-                    device.invalidate([0, 0, canvas.width, canvas.height]);
-                    device.delete();
-                    this.subject.update();
-                }
-                view.delete();
-            };
-            this.subject = subject;
-            this.needInputText = false;
-            this.mouseDownPosition = { x: 0, y: 0 };
-            this.autoSelect = false;
-            this.onmessage = (event) => this.subject.emitEvent(event);
-            this.canvasEvents = CANVAS_EVENTS;
+        set facesOverlap(value) {
+            this._data.facesOverlap = value;
+            this.notifierChangeEvent();
         }
-        initialize() {
-            this.canvasEvents = this.canvasEvents.filter((x) => typeof this[x] === "function");
-            this.canvasEvents.forEach((x) => (this[x] = this[x].bind(this)));
-            this.canvasEvents.forEach((x) => this.subject.on(x, this[x]));
-            this.getViewer().setEnableAutoSelect(!!this.autoSelect);
+        get facesTransparancy() {
+            return this._data.facesTransparancy;
         }
-        dispose() {
-            this.canvasEvents.forEach((x) => this.subject.off(x, this[x]));
+        set facesTransparancy(value) {
+            this._data.facesTransparancy = value;
+            this.notifierChangeEvent();
         }
-        relativeCoords(event) {
-            return { x: event.offsetX * window.devicePixelRatio, y: event.offsetY * window.devicePixelRatio };
+        get enableCustomHighlight() {
+            return this._data.enableCustomHighlight;
         }
-        pointerdown(ev) {
-            if (!ev.isPrimary || OdBaseDragger.isGestureActive) {
-                return;
-            }
-            ev.target.setPointerCapture(ev.pointerId);
-            const relCoord = this.relativeCoords(ev);
-            this.isDragging = true;
-            this.mouseDownPosition = { x: relCoord.x, y: relCoord.y };
-            this.start(relCoord.x, relCoord.y, ev.clientX, ev.clientY);
-            this.subject.update();
+        set enableCustomHighlight(value) {
+            this._data.enableCustomHighlight = value;
+            this.notifierChangeEvent();
         }
-        pointerup(ev) {
-            if (OdBaseDragger.needSkipPointerUp) {
-                return;
-            }
-            if (!ev.isPrimary) {
-                return;
-            }
-            ev.target.releasePointerCapture(ev.pointerId);
-            const relCoord = this.relativeCoords(ev);
-            this.end(relCoord.x, relCoord.y);
-            this.isDragging = false;
-            this.subject.update();
+        get sceneGraph() {
+            return this._data.sceneGraph;
         }
-        pointercancel(ev) {
-            if (!ev.isPrimary) {
-                return;
-            }
-            this.m_module.canvas.dispatchEvent(new PointerEvent("pointerup", ev));
+        set sceneGraph(value) {
+            this._data.sceneGraph = value;
+            if (value)
+                this._data.enablePartialMode = false;
+            this.notifierChangeEvent();
         }
-        pointermove(ev) {
-            if (!ev.isPrimary || OdBaseDragger.isGestureActive) {
-                return;
-            }
-            const relCoord = this.relativeCoords(ev);
-            this.drag(relCoord.x, relCoord.y, ev.movementX, ev.movementY);
-            if (this.isDragging) {
-                this.subject.update();
-            }
+        get edgeModel() {
+            return Boolean(this._data.edgeModel);
         }
-        click(ev) {
-            const viewer = this.getViewer();
-            const relCoord = this.relativeCoords(ev);
-            const x = relCoord.x;
-            const y = relCoord.y;
-            const isNotDragging = Math.abs(x - this.mouseDownPosition.x) < CLICK_DELTA && Math.abs(y - this.mouseDownPosition.y) < CLICK_DELTA;
-            if (viewer && viewer.getEnableAutoSelect() && isNotDragging) {
-                viewer.unselect();
-                viewer.select(x, y, x, y);
-                this.subject.update();
-                const selectionSet = viewer.getSelected();
-                const handles = this.subject.getSelected();
-                this.onmessage({ type: "select", data: selectionSet, handles });
-            }
+        set edgeModel(value) {
+            this._data.edgeModel = Boolean(value);
+            this.notifierChangeEvent();
         }
-        dblclick(ev) {
-            const viewer = this.getViewer();
-            const relCoord = this.relativeCoords(ev);
-            const x = relCoord.x;
-            const y = relCoord.y;
-            const device = viewer.getActiveDevice();
-            const clickView = device.viewAt([x, y]);
-            if (clickView && !clickView.active) {
-                viewer.activeView = clickView;
-                clickView.delete();
-                this.subject.update();
-            }
-            else {
-                if (viewer && viewer.getEnableAutoSelect()) {
-                    const pSelected = viewer.getSelected();
-                    if (!pSelected.isNull() && pSelected.numItems() !== 0) {
-                        const itr = pSelected.getIterator();
-                        const entity = itr.getEntity();
-                        viewer.zoomToEntity(entity);
-                        this.onmessage({ type: "zoomtoentity", data: entity });
-                        this.subject.update();
-                        this.deleteAll([itr, entity]);
-                    }
-                }
-            }
-            device.delete();
+        get reverseZoomWheel() {
+            return this._data.reverseZoomWheel;
         }
-        start(x, y, absoluteX = 0, absoluteY = 0) { }
-        drag(x, y, absoluteX = 0, absoluteY = 0) { }
-        end(x, y) { }
-        getActiveMarkupEntity(entityName) {
-            return this.subject.addMarkupEntity(entityName);
+        set reverseZoomWheel(value) {
+            this._data.reverseZoomWheel = !!value;
+            this.notifierChangeEvent();
         }
-        syncOverlayView() {
-            return this.subject.syncOverlay();
+        get enableZoomWheel() {
+            return this._data.enableZoomWheel;
         }
-        deleteAll(objects) {
-            var _a;
-            for (const obj of objects) {
-                (_a = obj === null || obj === void 0 ? void 0 : obj.delete) === null || _a === void 0 ? void 0 : _a.call(obj);
-            }
+        set enableZoomWheel(value) {
+            this._data.enableZoomWheel = !!value;
+            this.notifierChangeEvent();
         }
-        updatePreview() { }
-        static set isGestureActive(value) {
-            if (OdBaseDragger._isGestureActive === value) {
-                return;
-            }
-            OdBaseDragger._isGestureActive = value;
-            if (OdBaseDragger._isGestureActive) {
-                OdBaseDragger.needSkipPointerUp = true;
-            }
+        get enableGestures() {
+            return this._data.enableGestures;
         }
-        static get isGestureActive() {
-            return OdBaseDragger._isGestureActive;
+        set enableGestures(value) {
+            this._data.enableGestures = !!value;
+            this.notifierChangeEvent();
         }
-        static get needSkipPointerUp() {
-            if (OdBaseDragger._needSkipPointerUp) {
-                OdBaseDragger.needSkipPointerUp = false;
-                return true;
-            }
-            return false;
+        get geometryType() {
+            return this._data.geometryType;
         }
-        static set needSkipPointerUp(value) {
-            OdBaseDragger._needSkipPointerUp = value;
+        set geometryType(value) {
+            this._data.geometryType = value;
+            this.notifierChangeEvent();
         }
     }
-    OdBaseDragger._isGestureActive = false;
-    OdBaseDragger._needSkipPointerUp = false;
 
     function createHtmlElementIfNeed(element, targetElement, dataTestId) {
         if (!element) {
@@ -6997,7 +7030,7 @@
     	            : {};
     	exports.Konva = {
     	    _global: exports.glob,
-    	    version: '9.3.1',
+    	    version: '9.3.3',
     	    isBrowser: detectBrowser(),
     	    isUnminified: /param/.test(function (param) { }.toString()),
     	    dblClickWindow: 400,
@@ -9906,8 +9939,8 @@
                 pixelRatio: pixelRatio,
             }), context = canvas.getContext();
             const bufferCanvas = new Canvas_1$1.SceneCanvas({
-                width: canvas.width,
-                height: canvas.height,
+                width: canvas.width / canvas.pixelRatio + Math.abs(x),
+                height: canvas.height / canvas.pixelRatio + Math.abs(y),
                 pixelRatio: canvas.pixelRatio,
             });
             if (config.imageSmoothingEnabled === false) {
@@ -18580,7 +18613,7 @@
 
     class KonvaRectangle {
         constructor(params, ref = null) {
-            var _a, _b;
+            var _a, _b, _c, _d;
             if (ref) {
                 this._ref = ref;
                 return;
@@ -18595,8 +18628,8 @@
                 lineJoin: "round",
                 x: params.position.x,
                 y: params.position.y,
-                width: params.width,
-                height: params.height,
+                width: (_c = params.width) !== null && _c !== void 0 ? _c : 200,
+                height: (_d = params.height) !== null && _d !== void 0 ? _d : 200,
                 draggable: true,
                 strokeScaleEnabled: false,
             });
@@ -19257,9 +19290,9 @@
             this.loadMarkup(viewpoint);
         }
         getViewpoint() {
-            // TODO: at the current 25.2 state we need VisualizeJS here and below. In the future we need to use it as an external interface
+            // TODO: at the current 25.2 state we need VisualizeJS here and below. In the future we need to use it as an external interface.
             if (!this._viewer.visualizeJs)
-                return { file_id: "" };
+                return {};
             const viewpoint = {
                 lines: [],
                 texts: [],
@@ -19797,9 +19830,9 @@
             }
             const konvaLine = new KonvaLine({
                 points,
-                color: color || this._markupColor.HexColor,
                 type: type || "solid",
                 width: width || this.lineWidth,
+                color: color || this._markupColor.HexColor,
                 id,
             });
             const obj = konvaLine.ref();
@@ -19861,9 +19894,9 @@
                 const konvaText = new KonvaText({
                     position: { x: position.x, y: position.y },
                     text: specifiedText,
+                    rotation: angle,
                     fontSize,
                     color: color || this._markupColor.HexColor,
-                    rotation: angle,
                     id,
                 });
                 this._konvaLayer.add(konvaText.ref());
@@ -19882,10 +19915,10 @@
                 return;
             const konvaRectangle = new KonvaRectangle({
                 position,
-                color: color || this._markupColor.HexColor,
-                lineWidth: lineWidth || this.lineWidth,
                 width,
                 height,
+                lineWidth: lineWidth || this.lineWidth,
+                color: color || this._markupColor.HexColor,
                 id,
             });
             const obj = konvaRectangle.ref();
@@ -20172,7 +20205,7 @@
                 return { x: array[0], y: array[1], z: array[2] };
             }
             if (!this._viewer.visualizeJs)
-                return { file_id: "" };
+                return {};
             const visLib = this._viewer.visLib();
             const visViewer = visLib.getViewer();
             const viewpoint = {
@@ -20300,7 +20333,6 @@
             this.configure(params);
             this._options = new Options(this);
             this.client = client;
-            this.clientoptionschange = (event) => (this._options.data = event.data.data);
             this._activeDragger = null;
             this._renderTime = 0;
             this.markup = MarkupFactory.createMarkup((_a = params.markupType) !== null && _a !== void 0 ? _a : MarkupType.Konva);
@@ -20329,11 +20361,6 @@
         }
         /**
          * `VisualizeJS` parameters.
-         *
-         * Use this only for standalone viewer instances. Use {@link Client#options | Client.options}
-         * instead if the viewer was created with a `Client` reference using
-         * {@link Viewer | Viewer.create(client)}. Changes in client options will be automatically
-         * applied to the viewer options.
          */
         get options() {
             return this._options;
@@ -20378,10 +20405,6 @@
          *   of the `VisualizeJS` library. Retrieves {@link event:visualizeprogress | visualizeprogress} event.
          */
         async initialize(canvas, onProgress) {
-            if (this.client) {
-                this.client.addEventListener("optionschange", this.clientoptionschange);
-                this.options.data = this.client.options.data;
-            }
             this.addEventListener("optionschange", (event) => this.syncOptions(event.data));
             if (canvas.style.width === "" && canvas.style.height === "") {
                 canvas.style.width = "100%";
@@ -20421,7 +20444,7 @@
          * release the `Viewer` instance.
          */
         dispose() {
-            var _a, _b, _c, _d, _e;
+            var _a, _b, _c, _d;
             this.cancel();
             this.emitEvent({ type: "dispose" });
             if (this.frameId)
@@ -20438,7 +20461,6 @@
             this.canvas = undefined;
             (_d = this.visualizeJs) === null || _d === void 0 ? void 0 : _d.getViewer().clear();
             this.visualizeJs = undefined;
-            (_e = this.client) === null || _e === void 0 ? void 0 : _e.removeEventListener("optionschange", this.clientoptionschange);
             return this;
         }
         /**
@@ -21508,7 +21530,7 @@
     commands("VisualizeJS").registerCommand("zoomToSelected", zoomToSelected);
 
     ///////////////////////////////////////////////////////////////////////////////
-    const version = "25.3.8";
+    const version = "25.3.10";
 
     exports.Assembly = Assembly;
     exports.CANVAS_EVENTS = CANVAS_EVENTS;