@thatopen/components 3.2.6 → 3.3.0

package/dist/index.cjs

@@ -3097,7 +3097,7 @@ const _ConfigManager = class _ConfigManager extends Component {
     /**
      * The list of all configurations of this app.
      */
-    __publicField(this, "list", new DataMap());
+    __publicField(this, "list", new FRAGS.DataMap());
     /** {@link Component.enabled} */
     __publicField(this, "enabled", true);
     components.add(_ConfigManager.uuid, this);
@@ -3916,6 +3916,7 @@ __publicField(_BoundingBoxer, "uuid", "d1444724-dba6-4cdd-a0c7-68ee1450d166");
 let BoundingBoxer = _BoundingBoxer;
 class FinderQuery {
   constructor(components, queries) {
+    __publicField(this, "name", "Query");
     __publicField(this, "customData", {});
     __publicField(this, "_components");
     __publicField(this, "_queries", []);
@@ -4040,9 +4041,10 @@ class FinderQuery {
    */
   toJSON() {
     const manager = this._components.get(ItemsFinder);
-    const name = manager.list.getKey(this) ?? "Finder Query";
+    const guid = manager.list.getKey(this) ?? UUID.create();
     const result = {
-      name,
+      guid,
+      name: this.name,
       customData: this.customData,
       queries: this.queries.map(this.serializeQueryParameters),
       aggregation: this.aggregation,
@@ -4075,6 +4077,7 @@ class FinderQuery {
    * @returns A `FinderQuery` instance.
    */
   fromJSON(data) {
+    this.name = data.name;
     this.customData = data.customData;
     this.aggregation = data.aggregation;
     this.cache = data.cache;
@@ -4106,7 +4109,17 @@ const _ItemsFinder = class _ItemsFinder extends Component {
    * @returns A map of model IDs to sets of item IDs that match the query.
    */
   async getItems(queries, config) {
-    const { modelIds } = config ?? {};
+    let modelsToCheck;
+    if (config) {
+      const { modelIds, items } = config;
+      if (items) {
+        const itemsModels = Object.keys(items);
+        if (itemsModels.length > 0)
+          modelsToCheck = itemsModels.map((entry) => new RegExp(`^${entry}$`));
+      } else if (modelIds) {
+        modelsToCheck = modelIds;
+      }
+    }
     const aggregation = (config == null ? void 0 : config.aggregation) ?? "exclusive";
     const fragments = this.components.get(FragmentsManager);
     const results = await Promise.all(
@@ -4114,9 +4127,11 @@ const _ItemsFinder = class _ItemsFinder extends Component {
         const result = {};
         await Promise.all(
           Array.from(fragments.list).map(async ([id, model]) => {
-            if (modelIds && !modelIds.some((regex) => regex.test(id)))
+            var _a2;
+            if (modelsToCheck && !modelsToCheck.some((regex) => regex.test(id)))
               return;
-            const items = await model.getItemsByQuery(query);
+            const localIds = (_a2 = config == null ? void 0 : config.items) == null ? void 0 : _a2[id];
+            const items = await model.getItemsByQuery(query, { localIds: localIds ? [...localIds] : void 0 });
             result[id] = new Set(items);
           })
         );
@@ -4175,9 +4190,8 @@ const _ItemsFinder = class _ItemsFinder extends Component {
     if (!data)
       return instances;
     for (const value of data) {
-      const { name, customData, queries, aggregation, cache } = value;
-      const finderQuery = this.create(name, []);
-      finderQuery.fromJSON({ customData, queries, aggregation, cache });
+      const finderQuery = this.create(value.guid, []);
+      finderQuery.fromJSON(value);
       instances.push(finderQuery);
     }
     return instances;
@@ -4566,6 +4580,448 @@ const _Classifier = class _Classifier extends Component {
  */
 __publicField(_Classifier, "uuid", "e25a7f3c-46c4-4a14-9d3d-5115f24ebeb7");
 let Classifier = _Classifier;
+class FastModelPicker {
+  constructor(components, world) {
+    /** {@link Component.enabled} */
+    __publicField(this, "enabled", true);
+    /** The components instance to which this FastModelPicker belongs. */
+    __publicField(this, "components");
+    /** {@link Disposable.onDisposed} */
+    __publicField(this, "onDisposed", new Event());
+    /** The position of the mouse in the screen. */
+    __publicField(this, "mouse");
+    /**
+     * A reference to the world instance to which this FastModelPicker belongs.
+     * This is used to access the camera and scene.
+     */
+    __publicField(this, "world");
+    /**
+     * Whether debug mode is enabled. When enabled, shows the color-coded canvas.
+     */
+    __publicField(this, "debugMode", false);
+    /**
+     * Map from color (as RGB number) to model ID.
+     * Color is encoded as: (r << 16) | (g << 8) | b
+     */
+    __publicField(this, "colorToModelId", /* @__PURE__ */ new Map());
+    /**
+     * Map from model ID to color.
+     */
+    __publicField(this, "modelIdToColor", /* @__PURE__ */ new Map());
+    /**
+     * Render target for the color-coded scene.
+     */
+    __publicField(this, "renderTarget");
+    /**
+     * Size of the render target (stored separately since getSize doesn't exist).
+     */
+    __publicField(this, "renderTargetSize", new THREE__namespace.Vector2());
+    /**
+     * Debug canvas element (shown when debugMode is true).
+     */
+    __publicField(this, "debugCanvas");
+    /**
+     * Debug container element.
+     */
+    __publicField(this, "debugContainer");
+    /**
+     * Material used for color-coding models.
+     */
+    __publicField(this, "colorMaterials", /* @__PURE__ */ new Map());
+    /**
+     * Original materials cache (to restore after picking).
+     */
+    __publicField(this, "originalMaterials", /* @__PURE__ */ new Map());
+    __publicField(this, "originalLodColors", /* @__PURE__ */ new Map());
+    /**
+     * Whether colors need to be reassigned (when models change).
+     */
+    __publicField(this, "colorsNeedUpdate", true);
+    const renderer = world.renderer;
+    if (!renderer) {
+      throw new Error("A renderer is needed for the FastModelPicker to work!");
+    }
+    this.world = world;
+    this.mouse = new Mouse(renderer.three.domElement);
+    this.components = components;
+    this.setupRenderTarget();
+    this.setupFragmentListeners();
+  }
+  /**
+   * Sets up listeners for fragment model changes.
+   */
+  setupFragmentListeners() {
+    const fragments = this.components.get(FragmentsManager);
+    fragments.list.onItemSet.add(() => {
+      this.colorsNeedUpdate = true;
+    });
+    fragments.list.onItemDeleted.add(() => {
+      this.colorsNeedUpdate = true;
+    });
+  }
+  /**
+   * Sets up the render target for color-coded picking.
+   */
+  setupRenderTarget() {
+    const renderer = this.world.renderer.three;
+    const size = renderer.getSize(new THREE__namespace.Vector2());
+    this.renderTargetSize.copy(size);
+    this.renderTarget = new THREE__namespace.WebGLRenderTarget(size.x, size.y);
+    this.renderTarget.texture.format = THREE__namespace.RGBAFormat;
+    this.renderTarget.texture.type = THREE__namespace.UnsignedByteType;
+    if (this.debugMode) {
+      this.setupDebugCanvas();
+    }
+    this.world.renderer.onResize.add((size2) => {
+      this.renderTargetSize.copy(size2);
+      this.renderTarget.setSize(size2.x, size2.y);
+      if (this.debugCanvas) {
+        this.debugCanvas.width = size2.x;
+        this.debugCanvas.height = size2.y;
+      }
+    });
+  }
+  /**
+   * Sets up the debug canvas for visualization.
+   */
+  setupDebugCanvas() {
+    if (this.debugCanvas)
+      return;
+    const size = this.world.renderer.three.getSize(new THREE__namespace.Vector2());
+    this.debugContainer = document.createElement("div");
+    this.debugContainer.style.position = "fixed";
+    this.debugContainer.style.top = "10px";
+    this.debugContainer.style.right = "10px";
+    this.debugContainer.style.width = "300px";
+    this.debugContainer.style.height = "300px";
+    this.debugContainer.style.border = "2px solid #fff";
+    this.debugContainer.style.backgroundColor = "#000";
+    this.debugContainer.style.zIndex = "10000";
+    this.debugContainer.style.pointerEvents = "none";
+    this.debugCanvas = document.createElement("canvas");
+    this.debugCanvas.width = size.x;
+    this.debugCanvas.height = size.y;
+    this.debugCanvas.style.width = "100%";
+    this.debugCanvas.style.height = "100%";
+    this.debugCanvas.style.imageRendering = "pixelated";
+    this.debugContainer.appendChild(this.debugCanvas);
+    document.body.appendChild(this.debugContainer);
+  }
+  /**
+   * Generates a deterministic color for a model based on its ID.
+   * This ensures the same model always gets the same color.
+   */
+  generateColorForModel(modelId) {
+    let hash = 0;
+    for (let i = 0; i < modelId.length; i++) {
+      hash = (hash << 5) - hash + modelId.charCodeAt(i);
+      hash &= hash;
+    }
+    let colorId = Math.abs(hash) % 16777215;
+    if (colorId === 0) {
+      colorId = 1;
+    }
+    const r = colorId >> 16 & 255 || 1;
+    const g = colorId >> 8 & 255 || 1;
+    const b = colorId & 255 || 1;
+    return new THREE__namespace.Color(r / 255, g / 255, b / 255);
+  }
+  /**
+   * Converts a color to a numeric ID.
+   */
+  colorToId(color) {
+    const r = Math.round(color.r * 255);
+    const g = Math.round(color.g * 255);
+    const b = Math.round(color.b * 255);
+    return r << 16 | g << 8 | b;
+  }
+  /**
+   * Assigns unique colors to all fragment models.
+   * Colors are deterministic based on model ID, so the same model always gets the same color.
+   */
+  assignColors() {
+    const fragments = this.components.get(FragmentsManager);
+    if (!fragments.initialized) {
+      return;
+    }
+    if (!this.colorsNeedUpdate) {
+      const currentModelIds = new Set(fragments.list.keys());
+      const cachedModelIds = new Set(this.modelIdToColor.keys());
+      if (currentModelIds.size !== cachedModelIds.size || [...currentModelIds].some((id) => !cachedModelIds.has(id))) {
+        this.colorsNeedUpdate = true;
+      }
+    }
+    if (!this.colorsNeedUpdate) {
+      return;
+    }
+    this.colorToModelId.clear();
+    this.modelIdToColor.clear();
+    for (const material of this.colorMaterials.values()) {
+      material.dispose();
+    }
+    this.colorMaterials.clear();
+    for (const [modelId] of fragments.list) {
+      const color = this.generateColorForModel(modelId);
+      const colorId = this.colorToId(color);
+      this.colorToModelId.set(colorId, modelId);
+      this.modelIdToColor.set(modelId, color);
+      const material = new THREE__namespace.MeshBasicMaterial({
+        color,
+        depthTest: true,
+        depthWrite: true
+      });
+      this.colorMaterials.set(modelId, material);
+    }
+    this.colorsNeedUpdate = false;
+  }
+  /**
+   * Applies color materials to fragment models.
+   */
+  applyColorMaterials() {
+    const fragments = this.components.get(FragmentsManager);
+    if (!fragments.initialized) {
+      return;
+    }
+    for (const [modelId, model] of fragments.list) {
+      const modelMaterial = this.colorMaterials.get(modelId);
+      if (!modelMaterial)
+        continue;
+      model.object.traverse((child) => {
+        if (child instanceof THREE__namespace.Mesh) {
+          if ("isLODGeometry" in child.geometry) {
+            const originalLodMaterial = child.material[0];
+            const lodColor = originalLodMaterial.uniforms.lodColor;
+            if (!this.originalLodColors.has(lodColor)) {
+              this.originalLodColors.set(lodColor, lodColor.value);
+            }
+            lodColor.value = modelMaterial.color;
+            return;
+          }
+          if (!this.originalMaterials.has(child)) {
+            this.originalMaterials.set(child, child.material);
+          }
+          child.material = modelMaterial;
+        }
+      });
+    }
+  }
+  /**
+   * Restores original materials to fragment models.
+   */
+  restoreOriginalMaterials() {
+    for (const [object, material] of this.originalMaterials) {
+      object.material = material;
+    }
+    for (const [lodColor, color] of this.originalLodColors) {
+      lodColor.value = color;
+    }
+    this.originalMaterials.clear();
+  }
+  /**
+   * Renders the scene with color-coded models.
+   */
+  renderColorCoded() {
+    if (!this.renderTarget || !this.world.renderer) {
+      throw new Error("Render target not initialized!");
+    }
+    const renderer = this.world.renderer.three;
+    const scene = this.world.scene.three;
+    const camera = this.world.camera.three;
+    const currentRenderTarget = renderer.getRenderTarget();
+    const currentAutoClear = renderer.autoClear;
+    const currentClearColor = new THREE__namespace.Color();
+    const currentClearAlpha = renderer.getClearAlpha();
+    renderer.getClearColor(currentClearColor);
+    this.applyColorMaterials();
+    renderer.setRenderTarget(this.renderTarget);
+    renderer.autoClear = true;
+    renderer.setClearColor(0, 1);
+    renderer.clear(true, true, false);
+    renderer.render(scene, camera);
+    renderer.setRenderTarget(currentRenderTarget);
+    renderer.autoClear = currentAutoClear;
+    renderer.setClearColor(currentClearColor, currentClearAlpha);
+    this.restoreOriginalMaterials();
+    if (this.debugMode && this.debugCanvas) {
+      this.updateDebugCanvas();
+    }
+  }
+  /**
+   * Updates the debug canvas with the color-coded render.
+   */
+  updateDebugCanvas() {
+    if (!this.debugCanvas || !this.renderTarget || !this.world.renderer)
+      return;
+    const renderer = this.world.renderer.three;
+    const size = this.renderTargetSize;
+    const pixels = new Uint8Array(size.x * size.y * 4);
+    renderer.readRenderTargetPixels(
+      this.renderTarget,
+      0,
+      0,
+      size.x,
+      size.y,
+      pixels
+    );
+    const ctx = this.debugCanvas.getContext("2d");
+    if (!ctx)
+      return;
+    const imageData = ctx.createImageData(size.x, size.y);
+    const rowSize = size.x * 4;
+    for (let y = 0; y < size.y; y++) {
+      const srcRow = y;
+      const dstRow = size.y - 1 - y;
+      const srcOffset = srcRow * rowSize;
+      const dstOffset = dstRow * rowSize;
+      imageData.data.set(
+        pixels.subarray(srcOffset, srcOffset + rowSize),
+        dstOffset
+      );
+    }
+    ctx.putImageData(imageData, 0, 0);
+  }
+  /**
+   * Gets the model ID at the given screen position.
+   *
+   * @param position - Optional screen position. If not provided, uses current mouse position.
+   * @returns The model ID at the position, or null if no model is found.
+   */
+  async getModelAt(position) {
+    if (!this.renderTarget || !this.world.renderer) {
+      throw new Error("Render target not initialized!");
+    }
+    const fragments = this.components.get(FragmentsManager);
+    if (!fragments.initialized || fragments.list.size === 0) {
+      return null;
+    }
+    this.assignColors();
+    this.renderColorCoded();
+    const pos = position || this.mouse.position;
+    const size = this.renderTargetSize;
+    const x = Math.floor((pos.x + 1) * 0.5 * size.x);
+    const y = Math.floor((pos.y + 1) * 0.5 * (size.y - 1));
+    const clampedX = Math.max(0, Math.min(size.x - 1, x));
+    const clampedY = Math.max(0, Math.min(size.y - 1, y));
+    const renderer = this.world.renderer.three;
+    const pixels = new Uint8Array(4);
+    renderer.readRenderTargetPixels(
+      this.renderTarget,
+      clampedX,
+      clampedY,
+      1,
+      1,
+      pixels
+    );
+    const r = pixels[0];
+    const g = pixels[1];
+    const b = pixels[2];
+    const colorId = r << 16 | g << 8 | b;
+    const modelId = this.colorToModelId.get(colorId);
+    return modelId || null;
+  }
+  /**
+   * Enables or disables debug mode.
+   * When enabled, shows a canvas with the color-coded render.
+   */
+  setDebugMode(enabled) {
+    this.debugMode = enabled;
+    if (enabled) {
+      this.setupDebugCanvas();
+    } else {
+      this.removeDebugCanvas();
+    }
+  }
+  /**
+   * Removes the debug canvas.
+   */
+  removeDebugCanvas() {
+    if (this.debugContainer) {
+      this.debugContainer.remove();
+      this.debugContainer = void 0;
+      this.debugCanvas = void 0;
+    }
+  }
+  /** {@link Disposable.dispose} */
+  dispose() {
+    this.mouse.dispose();
+    this.removeDebugCanvas();
+    for (const material of this.colorMaterials.values()) {
+      material.dispose();
+    }
+    this.colorMaterials.clear();
+    if (this.renderTarget) {
+      this.renderTarget.dispose();
+    }
+    this.colorToModelId.clear();
+    this.modelIdToColor.clear();
+    this.originalMaterials.clear();
+    this.originalLodColors.clear();
+    this.onDisposed.trigger();
+    this.onDisposed.reset();
+  }
+}
+const _FastModelPickers = class _FastModelPickers extends Component {
+  constructor(components) {
+    super(components);
+    /** {@link Component.enabled} */
+    __publicField(this, "enabled", true);
+    /**
+     * A Map that stores FastModelPicker instances for each world.
+     * The key is the world's UUID, and the value is the corresponding FastModelPicker instance.
+     */
+    __publicField(this, "list", /* @__PURE__ */ new Map());
+    /** {@link Disposable.onDisposed} */
+    __publicField(this, "onDisposed", new Event());
+    components.add(_FastModelPickers.uuid, this);
+  }
+  /**
+   * Retrieves a FastModelPicker instance for the given world.
+   * If a FastModelPicker instance already exists for the world, it will be returned.
+   * Otherwise, a new FastModelPicker instance will be created and added to the list.
+   *
+   * @param world - The world for which to retrieve or create a FastModelPicker instance.
+   * @returns The FastModelPicker instance for the given world.
+   */
+  get(world) {
+    if (this.list.has(world.uuid)) {
+      return this.list.get(world.uuid);
+    }
+    const picker = new FastModelPicker(this.components, world);
+    this.list.set(world.uuid, picker);
+    world.onDisposed.add(() => {
+      this.delete(world);
+    });
+    return picker;
+  }
+  /**
+   * Deletes the FastModelPicker instance associated with the given world.
+   * If a FastModelPicker instance exists for the given world, it will be disposed and removed from the list.
+   *
+   * @param world - The world for which to delete the FastModelPicker instance.
+   * @returns {void}
+   */
+  delete(world) {
+    const picker = this.list.get(world.uuid);
+    if (picker) {
+      picker.dispose();
+    }
+    this.list.delete(world.uuid);
+  }
+  /** {@link Disposable.dispose} */
+  dispose() {
+    for (const [_id, picker] of this.list) {
+      picker.dispose();
+    }
+    this.list.clear();
+    this.onDisposed.trigger();
+  }
+};
+/**
+ * A unique identifier for the component.
+ * This UUID is used to register the component within the Components system.
+ */
+__publicField(_FastModelPickers, "uuid", "4a82430c-7ff2-49ea-9401-60807502dad6");
+let FastModelPickers = _FastModelPickers;
 class SimpleRaycaster {
   constructor(components, world) {
     /** {@link Component.enabled} */
@@ -4586,6 +5042,13 @@ class SimpleRaycaster {
      * This is used to access the camera and meshes.
      */
     __publicField(this, "world");
+    /**
+     * Whether to use fast model picking to optimize raycasting.
+     * When enabled, the raycaster will first use FastModelPicker to identify
+     * which model is under the mouse, then only raycast that specific model.
+     * This can significantly improve performance when there are many models.
+     */
+    __publicField(this, "useFastModelPicking", false);
     const renderer = world.renderer;
     if (!renderer) {
       throw new Error("A renderer is needed for the raycaster to work!");
@@ -4632,12 +5095,46 @@ class SimpleRaycaster {
     const mouse = this.mouse.rawPosition;
     let fragResult = null;
     if (fragments.initialized) {
-      fragResult = await fragments.raycast({
-        camera,
-        dom,
-        mouse,
-        snappingClasses
-      });
+      if (this.useFastModelPicking) {
+        const fastPickers = this.components.get(FastModelPickers);
+        const fastPicker = fastPickers.get(this.world);
+        const modelId = await fastPicker.getModelAt(position);
+        if (modelId) {
+          const model = fragments.list.get(modelId);
+          if (model) {
+            if (snappingClasses && snappingClasses.length > 0) {
+              const snappingRaycast = await model.raycastWithSnapping({
+                camera,
+                dom,
+                mouse,
+                snappingClasses
+              });
+              if (snappingRaycast && snappingRaycast.length > 0) {
+                fragResult = snappingRaycast[0];
+              } else {
+                fragResult = await model.raycast({
+                  camera,
+                  dom,
+                  mouse
+                });
+              }
+            } else {
+              fragResult = await model.raycast({
+                camera,
+                dom,
+                mouse
+              });
+            }
+          }
+        }
+      } else {
+        fragResult = await fragments.raycast({
+          camera,
+          dom,
+          mouse,
+          snappingClasses
+        });
+      }
       if (items.length === 0) {
         return fragResult;
       }
@@ -7663,7 +8160,7 @@ const _Worlds = class _Worlds extends Component {
      * A collection of worlds managed by this component.
      * The key is the unique identifier (UUID) of the world, and the value is the World instance.
      */
-    __publicField(this, "list", new DataMap());
+    __publicField(this, "list", new FRAGS.DataMap());
     /** {@link Component.enabled} */
     __publicField(this, "enabled", true);
     components.add(_Worlds.uuid, this);
@@ -11535,10 +12032,11 @@ const _Components = class _Components {
    * @throws Will throw an error if a component with the same UUID already exists.
    */
   get(Component2) {
+    var _a2;
     const uuid = Component2.uuid;
     if (!this.list.has(uuid)) {
       const toolInstance = new Component2(this);
-      if (toolInstance.isDisposeable()) {
+      if ((_a2 = toolInstance.isDisposeable) == null ? void 0 : _a2.call(toolInstance)) {
         toolInstance.onDisposed.add(() => this.list.delete(uuid));
       }
       if (!this.list.has(uuid)) {
@@ -11988,6 +12486,14 @@ class OrthoPerspectiveCamera extends SimpleCamera {
       this.disableUserInput();
     }
   }
+  /**
+   * Adds a custom {@link NavigationMode} to the camera that can be used using the {@link OrthoPerspectiveCamera.set} method.
+   *
+   * @param mode - The custom {@link NavigationMode} to add.
+   */
+  addCustomNavigationMode(mode) {
+    this._navigationModes.set(mode.id, mode);
+  }
   disableUserInput() {
     this._userInputButtons.left = this.controls.mouseButtons.left;
     this._userInputButtons.right = this.controls.mouseButtons.right;
@@ -14770,13 +15276,13 @@ const _Topic = class _Topic {
     __publicField(this, "creationDate", /* @__PURE__ */ new Date());
     __publicField(this, "creationAuthor", "");
     // Store viewpoint guids instead of the actual Viewpoint to prevent a possible memory leak
-    __publicField(this, "viewpoints", new DataSet());
+    __publicField(this, "viewpoints", new FRAGS.DataSet());
     // Store topic guids instead of the actual Topic to prevent a possible memory leak
-    __publicField(this, "relatedTopics", new DataSet());
+    __publicField(this, "relatedTopics", new FRAGS.DataSet());
     // There is no problem to store the comment it-self as it is not referenced anywhere else
-    __publicField(this, "comments", new DataMap());
+    __publicField(this, "comments", new FRAGS.DataMap());
     // Store document reference guids instead of the actual thing to prevent a possible memory leak
-    __publicField(this, "documentReferences", new DataSet());
+    __publicField(this, "documentReferences", new FRAGS.DataSet());
     __publicField(this, "customData", {});
     __publicField(this, "description");
     __publicField(this, "serverAssignedId");
@@ -15386,8 +15892,8 @@ const _BCFTopics = class _BCFTopics extends Component {
       "BCF Topics",
       _BCFTopics.uuid
     ));
-    __publicField(this, "list", new DataMap());
-    __publicField(this, "documents", new DataMap());
+    __publicField(this, "list", new FRAGS.DataMap());
+    __publicField(this, "documents", new FRAGS.DataMap());
     __publicField(this, "onSetup", new Event());
     __publicField(this, "isSetup", false);
     __publicField(this, "onBCFImported", new Event());
@@ -17321,6 +17827,15 @@ class SimplePlane {
   get helper() {
     return this._helper;
   }
+  /**
+   * Getter for the transform controls of the clipping plane.
+   * The controls allow interactive manipulation (translation, rotation, etc.) of the clipping plane.
+   *
+   * @returns {TransformControls} The transform controls of the clipping plane.
+   */
+  get controls() {
+    return this._controls;
+  }
   /**
    * Sets the clipping plane's normal and origin from the given normal and point.
    * This method resets the clipping plane's state, updates the normal and origin,
@@ -17585,6 +18100,7 @@ const _Clipper = class _Clipper extends Component {
     __publicField(this, "_size", 5);
     __publicField(this, "_enabled", false);
     __publicField(this, "_visible", true);
+    __publicField(this, "onStateChanged", new Event());
     __publicField(this, "_onStartDragging", () => {
       this.onBeforeDrag.trigger();
     });
@@ -17601,6 +18117,7 @@ const _Clipper = class _Clipper extends Component {
   /** {@link Component.enabled} */
   set enabled(state) {
     this._enabled = state;
+    this.onStateChanged.trigger(["enabled"]);
   }
   /** {@link Hideable.visible } */
   get visible() {
@@ -17612,6 +18129,7 @@ const _Clipper = class _Clipper extends Component {
     for (const [_, plane] of this.list) {
       plane.visible = state;
     }
+    this.onStateChanged.trigger(["visibility"]);
   }
   /** The material of the clipping plane representation. */
   get material() {
@@ -17623,6 +18141,7 @@ const _Clipper = class _Clipper extends Component {
     for (const [_, plane] of this.list) {
       plane.planeMaterial = material;
     }
+    this.onStateChanged.trigger(["material"]);
   }
   /** The size of the geometric representation of the clippings planes. */
   get size() {
@@ -17634,6 +18153,7 @@ const _Clipper = class _Clipper extends Component {
     for (const [_, plane] of this.list) {
       plane.size = size;
     }
+    this.onStateChanged.trigger(["size"]);
   }
   setEvents() {
     this.list.onBeforeDelete.add(({ value: plane }) => {
@@ -17867,6 +18387,7 @@ class Viewpoint {
       camera_view_point: { x: 0, y: 0, z: 0 },
       camera_up_vector: { x: 0, y: 1, z: 0 }
     });
+    __publicField(this, "customData", {});
     /**
      * A list of components GUIDs to hide when defaultVisibility = true or to show when defaultVisibility = false
      */
@@ -21011,7 +21532,7 @@ const _IDSSpecifications = class _IDSSpecifications extends Component {
     super(components);
     __publicField(this, "enabled", true);
     __publicField(this, "IDSInfo");
-    __publicField(this, "list", new DataMap());
+    __publicField(this, "list", new FRAGS.DataMap());
     components.add(_IDSSpecifications.uuid, this);
   }
   /**
@@ -21538,11 +22059,6 @@ const _MeasurementUtils = class _MeasurementUtils extends Component {
       throw new Error("Precision must be an integer between 0 and 5.");
     }
     let factor = unitFactors[fromUnit] / unitFactors[toUnit];
-    if (fromUnit.endsWith("2") && toUnit.endsWith("2")) {
-      factor **= 2;
-    } else if (fromUnit.endsWith("3") && toUnit.endsWith("3")) {
-      factor **= 3;
-    }
     const convertedValue = value * factor;
     const roundingFactor = 10 ** precision;
     return Math.round(convertedValue * roundingFactor) / roundingFactor;
@@ -21576,6 +22092,8 @@ exports.DataSet = DataSet;
 exports.Disposer = Disposer;
 exports.Event = Event;
 exports.EventManager = EventManager;
+exports.FastModelPicker = FastModelPicker;
+exports.FastModelPickers = FastModelPickers;
 exports.FinderQuery = FinderQuery;
 exports.FirstPersonMode = FirstPersonMode;
 exports.FragmentsManager = FragmentsManager;