@3cr/viewer-browser 0.0.248 → 0.0.292

package/src/tools/__tests__/mcad-select.tool.spec.ts

@@ -0,0 +1,63 @@
+import { useMcadSelectTool } from '@/tools/mcad-select-tool';
+import { storeToRefs } from 'pinia';
+import { useMcadStore } from '@/stores/mcad.store';
+import { McadObjectInteractionFaker } from '@test/fakers/mcad-object-interaction.faker';
+import { InteractionType } from '@3cr/types-ts';
+import { flushPromises } from '@vue/test-utils';
+import { DataOverlayMcadFaker } from '@test/fakers/data-overlay-mcad.faker';
+
+describe('mcad select tool', () => {
+  const { event: mcadEvent } = storeToRefs(useMcadStore());
+
+  it('should select via 3cr event', async () => {
+    const mcadSelectTool = useMcadSelectTool();
+    mcadSelectTool.isActive.value = true;
+    mcadEvent.value = McadObjectInteractionFaker.randomRaw(InteractionType.POINTER_UP);
+    await flushPromises();
+
+    expect(mcadSelectTool.selected.value).not.toBe(null);
+  });
+
+  it('should select via 3cr event', async () => {
+    const mcadSelectTool = useMcadSelectTool();
+    mcadSelectTool.isActive.value = true;
+    mcadEvent.value = McadObjectInteractionFaker.randomRaw(InteractionType.NONE);
+    await flushPromises();
+
+    expect(mcadSelectTool.selected.value).toBe(null);
+  });
+
+  it('should select programmatically', async () => {
+    const mcadSelectTool = useMcadSelectTool();
+    mcadSelectTool.isActive.value = true;
+    mcadSelectTool.selected.value = DataOverlayMcadFaker.random();
+    await flushPromises();
+
+    expect(mcadSelectTool.selected.value).not.toBe(null);
+  });
+
+  it('should check if selected (not)', async () => {
+    const mcadSelectTool = useMcadSelectTool();
+
+    expect(mcadSelectTool.isSelected(DataOverlayMcadFaker.random())).toBeFalsy();
+  });
+
+  it('should toggle selected', async () => {
+    const mcadSelectTool = useMcadSelectTool();
+    mcadSelectTool.toggle(DataOverlayMcadFaker.random());
+
+    expect(mcadSelectTool.selected.value).not.toBe(null);
+  });
+
+  it('should toggle selected', async () => {
+    const mcadSelectTool = useMcadSelectTool();
+    const select = DataOverlayMcadFaker.random();
+    mcadSelectTool.toggle(select);
+
+    expect(mcadSelectTool.selected.value).not.toBe(null);
+
+    mcadSelectTool.toggle(select);
+
+    expect(mcadSelectTool.selected.value).toBe(null);
+  });
+});

package/src/tools/__tests__/measurement-angle.tool.spec.ts

@@ -0,0 +1,26 @@
+import { flushPromises } from '@vue/test-utils';
+import { useMeasurementAngleTool } from '@/tools/measurement-angle.tool';
+import { useViewer3cr } from '@/composables/useViewer3cr';
+import { MockInstance } from '@vitest/spy';
+
+describe('measurement angle tool', () => {
+  const viewer3cr = useViewer3cr();
+
+  let angleToolSpy: MockInstance;
+
+  beforeEach(() => {
+    angleToolSpy = vi.spyOn(viewer3cr, 'angleTool');
+  });
+
+  afterEach(() => {
+    angleToolSpy.mockRestore();
+  });
+
+  it('should activate tool', async () => {
+    const measurementAngleTool = useMeasurementAngleTool();
+    measurementAngleTool.isActive.value = true;
+    await flushPromises();
+
+    expect(angleToolSpy).toHaveBeenCalled();
+  });
+});

package/src/tools/__tests__/measurement-length.tool.spec.ts

@@ -0,0 +1,26 @@
+import { flushPromises } from '@vue/test-utils';
+import { useMeasurementLengthTool } from '@/tools/measurement-length.tool';
+import { useViewer3cr } from '@/composables/useViewer3cr';
+import { MockInstance } from '@vitest/spy';
+
+describe('measurement length tool', () => {
+  const viewer3cr = useViewer3cr();
+
+  let lengthToolSpy: MockInstance;
+
+  beforeEach(() => {
+    lengthToolSpy = vi.spyOn(viewer3cr, 'lengthTool');
+  });
+
+  afterEach(() => {
+    lengthToolSpy.mockRestore();
+  });
+
+  it('should activate tool', async () => {
+    const measurementLengthTool = useMeasurementLengthTool();
+    measurementLengthTool.isActive.value = true;
+    await flushPromises();
+
+    expect(lengthToolSpy).toHaveBeenCalled();
+  });
+});

package/src/tools/__tests__/measurement-polygon.tool.spec.ts

@@ -0,0 +1,26 @@
+import { flushPromises } from '@vue/test-utils';
+import { useMeasurementPolygonTool } from '@/tools/measurement-polygon.tool';
+import { useViewer3cr } from '@/composables/useViewer3cr';
+import { MockInstance } from '@vitest/spy';
+
+describe('measurement polygon tool', () => {
+  const viewer3cr = useViewer3cr();
+
+  let polygonToolSpy: MockInstance;
+
+  beforeEach(() => {
+    polygonToolSpy = vi.spyOn(viewer3cr, 'polygonTool');
+  });
+
+  afterEach(() => {
+    polygonToolSpy.mockRestore();
+  });
+
+  it('should activate tool', async () => {
+    const measurementPolygonTool = useMeasurementPolygonTool();
+    measurementPolygonTool.isActive.value = true;
+    await flushPromises();
+
+    expect(polygonToolSpy).toHaveBeenCalled();
+  });
+});

package/src/tools/annotation-create.tool.ts

@@ -0,0 +1,48 @@
+import { InteractivityState, ScanView } from '@3cr/types-ts';
+import { ref, watch } from 'vue';
+import { useViewer3cr } from '@/composables/useViewer3cr';
+import { useViewerStore } from '@/stores/viewer.store';
+import { storeToRefs } from 'pinia';
+import { useMouse } from '@/composables/useMouse';
+import { DataOverlayAnnotation } from '@3cr/viewer-types-ts';
+
+export function useAnnotationCreateTool() {
+  const viewer3cr = useViewer3cr();
+  const { activeView, m_annotationCreate, annotationCreateId } = storeToRefs(useViewerStore());
+  const { x: _x, y: _y } = useMouse(document.body);
+
+  const isActive = ref<boolean>(false);
+  const position = ref<[number, number]>([0, 0]);
+
+  viewer3cr.addActionHandler('mu_01', onAnnotate2d);
+
+  watch([isActive, activeView], async ([isActive, activeView]) => {
+    if (isActive && activeView !== undefined && activeView !== ScanView.Volume) {
+      await annotation2d(true);
+    }
+  });
+
+  watch(isActive, async (isActive) => {
+    if (!isActive) {
+      await annotation2d(false);
+    }
+  });
+
+  async function annotation2d(value: boolean): Promise<void> {
+    const message: InteractivityState = { Version: '0.0.0', Value: value };
+    await viewer3cr.createAnnotation2dTool({ message });
+  }
+
+  async function onAnnotate2d(_: string, channel: string, to: string): Promise<void> {
+    if (isActive && !annotationCreateId.value) {
+      const returnChannel = JSON.parse(channel) as DataOverlayAnnotation;
+      await viewer3cr.createAnnotation2dTool({ message: undefined, returnChannel, returnTo: to });
+      m_annotationCreate.value = true;
+      annotationCreateId.value = returnChannel.Id;
+      isActive.value = false;
+      position.value = [_x.value, _y.value];
+    }
+  }
+
+  return { isActive, position };
+}

package/src/tools/annotation-move.tool.ts

@@ -0,0 +1,48 @@
+import { InteractionType, ObjectBoolean, ScanView } from '@3cr/types-ts';
+import { ref, watch } from 'vue';
+import { useDataOverlayStore } from '@/stores/data-overlay.store';
+import { useViewer3cr } from '@/composables/useViewer3cr';
+import { storeToRefs } from 'pinia';
+import { useViewerStore } from '@/stores/viewer.store';
+import { DataOverlayAnnotation } from '@3cr/viewer-types-ts';
+
+export function useAnnotationMoveTool() {
+  const viewer3cr = useViewer3cr();
+  const { annotationEvent } = storeToRefs(useDataOverlayStore());
+  const { activeView } = storeToRefs(useViewerStore());
+
+  const isActive = ref<boolean>(false);
+  const selected = ref<DataOverlayAnnotation | null>(null);
+
+  watch(isActive, async (isActive) => {
+    if (!isActive && selected.value) {
+      await moveAnnotation2d(selected.value.Id, false);
+      await moveAnnotation3d(selected.value.Id, false);
+      selected.value = null;
+    }
+  });
+
+  watch(annotationEvent, async (event) => {
+    if (isActive.value && event?.Data.Interaction === InteractionType.POINTER_UP) {
+      if (activeView.value === ScanView.Volume) {
+        await moveAnnotation3d(event.Data.DataOverlay.Id, true);
+        selected.value = event.Data.DataOverlay;
+      } else if (activeView.value !== undefined) {
+        await moveAnnotation2d(event.Data.DataOverlay.Id, true);
+        selected.value = event.Data.DataOverlay;
+      }
+    }
+  });
+
+  async function moveAnnotation2d(id: string, value: boolean): Promise<void> {
+    const message: ObjectBoolean = { Version: '0.0.0', Id: id, Value: value };
+    await viewer3cr.moveAnnotation2dTool({ message });
+  }
+
+  async function moveAnnotation3d(id: string, value: boolean): Promise<void> {
+    const message: ObjectBoolean = { Version: '0.0.0', Id: id, Value: value };
+    await viewer3cr.moveAnnotation3dTool({ message });
+  }
+
+  return { isActive, selected };
+}

package/src/tools/data-overlay.tool.ts

@@ -1,71 +1,68 @@
-import { McadObjectInteraction } from '@/types/mcad-object-interaction';
-import { Interactiontype } from '@3cr/types-ts';
-import { DataOverlay } from '@/types/data-overlay';
-import { ref, watch, WatchStopHandle } from 'vue';
-import { useAnnotations } from '@/composables/useAnnotations';
-import { useMarkups } from '@/composables/useMarkups';
-import { useMcadObjects } from '@/composables/useMcadObjects';
-import { DataOverlayInteraction } from '@/types/data-overlay-interaction';
+import { ref, watch } from 'vue';
+import { InteractionType } from '@3cr/types-ts';
+import { useDataOverlayStore } from '@/stores/data-overlay.store';
+import { useMcadStore } from '@/stores/mcad.store';
+import { storeToRefs } from 'pinia';
+import { useEventListener } from '@/composables/useEventListener';
+import { DataOverlay, DataOverlayEvent, McadObjectInteraction } from '@3cr/viewer-types-ts';
 
+/**
+ * Displays an information modal when clicking on an annotation, measurement, or MCAD object.
+ */
 export function useDataOverlayTool() {
-  let _flag = false;
-  let _focused: DataOverlay | null = null;
-  let _handles: WatchStopHandle[] = [];
+  const { annotationEvent, measurementEvent } = storeToRefs(useDataOverlayStore());
+  const { mcadEvent } = storeToRefs(useMcadStore());
 
-  const { annotationEvent } = useAnnotations();
-  const { markupEvent } = useMarkups();
-  const { mcadObjectEvent } = useMcadObjects();
+  const _flag = ref<boolean>(false);
+  const _focused = ref<DataOverlay | null>(null);
+  const isActive = ref<boolean>(false);
   const selected = ref<DataOverlay | null>(null);
 
-  function activate(): void {
-    document.addEventListener('mousedown', onMouseDown);
-    document.addEventListener('mousemove', onMouseMove);
-    document.addEventListener('mouseup', onMouseUp);
-    _handles.push(
-      watch(annotationEvent, onInteraction),
-      watch(markupEvent, onInteraction),
-      watch(mcadObjectEvent, onMcadInteraction)
-    );
-  }
+  useEventListener(document.body, 'mousedown', onMouseDown);
+  useEventListener(document.body, 'mousemove', onMouseMove);
+  useEventListener(document.body, 'mouseup', onMouseUp);
 
-  function deactivate(): void {
-    document.removeEventListener('mousedown', onMouseDown);
-    document.removeEventListener('mousemove', onMouseMove);
-    document.removeEventListener('mouseup', onMouseUp);
-    _handles.forEach((handle) => handle());
-    _handles = [];
-    selected.value = null;
-  }
+  watch(annotationEvent, onInteraction);
+  watch(measurementEvent, onInteraction);
+  watch(mcadEvent, onMcadInteraction);
 
-  function onMouseDown(): void {
-    _flag = true;
+  function onMouseDown(event: MouseEvent): void {
+    if (isActive.value && event.button === 0) {
+      _flag.value = true;
+    }
   }
 
   function onMouseMove(): void {
-    _flag = false;
+    if (isActive.value) {
+      _flag.value = false;
+    }
   }
 
-  function onMouseUp(): void {
-    if (_flag) {
-      selected.value = _focused;
+  function onMouseUp(event: MouseEvent): void {
+    if (isActive.value && event.button === 0 && _flag.value) {
+      selected.value = _focused.value;
     }
   }
 
-  function onInteraction(event: DataOverlayInteraction<DataOverlay> | null): void {
-    if (event?.Interaction === Interactiontype.HOVER_START) {
-      _focused = event.DataOverlay;
-    } else if (event?.Interaction === Interactiontype.HOVER_END) {
-      _focused = null;
+  function onInteraction(event: DataOverlayEvent<DataOverlay> | null): void {
+    if (isActive.value) {
+      if (event?.Data.Interaction === InteractionType.HOVER_START) {
+        _focused.value = event.Data.DataOverlay;
+      } else if (event?.Data.Interaction === InteractionType.HOVER_END) {
+        _focused.value = null;
+      }
     }
   }
 
   function onMcadInteraction(event: McadObjectInteraction | null): void {
-    if (event?.Interaction === Interactiontype.HOVER_START) {
-      _focused = event.Mcad;
-    } else if (event?.Interaction === Interactiontype.HOVER_END) {
-      _focused = null;
+    if (isActive.value) {
+      if (event?.Interaction === InteractionType.HOVER_START) {
+        _focused.value = event.Mcad;
+      } else if (event?.Interaction === InteractionType.HOVER_END) {
+        _focused.value = null;
+      }
     }
   }
 
-  return { selected, activate, deactivate };
+  return { isActive, selected };
 }

package/src/tools/mcad-move.tool.ts

@@ -0,0 +1,47 @@
+import { ref, watch } from 'vue';
+import { InteractionType, ObjectBoolean } from '@3cr/types-ts';
+import { useMcadStore } from '@/stores/mcad.store';
+import { useViewer3cr } from '@/composables/useViewer3cr';
+import { storeToRefs } from 'pinia';
+import { DataOverlayMcad } from '@3cr/viewer-types-ts';
+
+export function useMcadMoveTool() {
+  const { mcadEvent } = storeToRefs(useMcadStore());
+  const viewer3cr = useViewer3cr();
+
+  const isActive = ref<boolean>(false);
+  const selected = ref<DataOverlayMcad | null>(null);
+
+  watch(isActive, async (isActive) => {
+    if (!isActive && selected.value?.Id) {
+      await move(selected.value.Id, false);
+      selected.value = null;
+    }
+  });
+
+  watch(mcadEvent, async (event) => {
+    if (isActive.value && event?.Interaction === InteractionType.POINTER_UP) {
+      await move(event.Mcad.Id, true);
+      selected.value = event.Mcad;
+    }
+  });
+
+  watch(selected, async (next, prev) => {
+    if (isActive.value) {
+      if (next && next.Id !== prev?.Id) {
+        await move(next.Id, true);
+        selected.value = next;
+      } else if (!next && prev?.Id) {
+        await move(prev.Id, false);
+        selected.value = null;
+      }
+    }
+  });
+
+  async function move(id: string, value: boolean): Promise<void> {
+    const message: ObjectBoolean = { Version: '0.0.0', Id: id, Value: value };
+    await viewer3cr.moveMcadObject({ message });
+  }
+
+  return { isActive, selected };
+}

package/src/tools/mcad-rotate.tool.ts

@@ -0,0 +1,47 @@
+import { ref, watch } from 'vue';
+import { InteractionType, ObjectBoolean } from '@3cr/types-ts';
+import { useMcadStore } from '@/stores/mcad.store';
+import { useViewer3cr } from '@/composables/useViewer3cr';
+import { storeToRefs } from 'pinia';
+import { DataOverlayMcad } from '@3cr/viewer-types-ts';
+
+export function useMcadRotateTool() {
+  const { mcadEvent } = storeToRefs(useMcadStore());
+  const viewer3cr = useViewer3cr();
+
+  const isActive = ref<boolean>(false);
+  const selected = ref<DataOverlayMcad | null>(null);
+
+  watch(isActive, async (isActive) => {
+    if (!isActive && selected.value?.Id) {
+      await rotate(selected.value.Id, false);
+      selected.value = null;
+    }
+  });
+
+  watch(mcadEvent, async (event) => {
+    if (isActive.value && event?.Interaction === InteractionType.POINTER_UP) {
+      await rotate(event.Mcad.Id, true);
+      selected.value = event.Mcad;
+    }
+  });
+
+  watch(selected, async (next, prev) => {
+    if (isActive.value) {
+      if (next && next.Id !== prev?.Id) {
+        await rotate(next.Id, true);
+        selected.value = next;
+      } else if (!next && prev?.Id) {
+        await rotate(prev.Id, false);
+        selected.value = null;
+      }
+    }
+  });
+
+  async function rotate(id: string, value: boolean): Promise<void> {
+    const message: ObjectBoolean = { Version: '0.0.0', Id: id, Value: value };
+    await viewer3cr.rotateMcadObject({ message });
+  }
+
+  return { isActive, selected };
+}

package/src/tools/mcad-scale-tool.ts

@@ -0,0 +1,10 @@
+import { ref } from 'vue';
+import { DataOverlayMcad } from '@3cr/viewer-types-ts';
+
+export function useMcadScaleTool() {
+  const isActive = ref<boolean>(false);
+
+  const selected = ref<DataOverlayMcad | null>(null);
+
+  return { isActive, selected };
+}

package/src/tools/mcad-select-tool.ts

@@ -0,0 +1,32 @@
+import { ref, watch } from 'vue';
+import { storeToRefs } from 'pinia';
+import { useMcadStore } from '@/stores/mcad.store';
+import { InteractionType } from '@3cr/types-ts';
+import { DataOverlayMcad } from '@3cr/viewer-types-ts';
+
+export function useMcadSelectTool() {
+  const { mcadEvent } = storeToRefs(useMcadStore());
+
+  const isActive = ref<boolean>(false);
+  const selected = ref<DataOverlayMcad | null>(null);
+
+  watch(mcadEvent, (event) => {
+    if (isActive.value && event?.Interaction === InteractionType.POINTER_UP) {
+      selected.value = event.Mcad;
+    }
+  });
+
+  function isSelected(mcad: DataOverlayMcad): boolean {
+    return selected.value?.Id === mcad.Id;
+  }
+
+  function toggle(mcad: DataOverlayMcad): void {
+    if (!isSelected(mcad)) {
+      selected.value = mcad;
+    } else {
+      selected.value = null;
+    }
+  }
+
+  return { isActive, selected, isSelected, toggle };
+}

package/src/tools/measurement-angle.tool.ts

@@ -0,0 +1,20 @@
+import { InteractivityState } from '@3cr/types-ts';
+import { useViewer3cr } from '@/composables/useViewer3cr';
+import { ref, watch } from 'vue';
+
+export function useMeasurementAngleTool() {
+  const viewer3cr = useViewer3cr();
+
+  const isActive = ref<boolean>(false);
+
+  watch(isActive, async (isActive) => {
+    await angleTool(isActive);
+  });
+
+  async function angleTool(value: boolean): Promise<void> {
+    const message: InteractivityState = { Version: '0.0.0', Value: value };
+    await viewer3cr.angleTool({ message });
+  }
+
+  return { isActive };
+}

package/src/tools/measurement-length.tool.ts

@@ -0,0 +1,20 @@
+import { InteractivityState } from '@3cr/types-ts';
+import { useViewer3cr } from '@/composables/useViewer3cr';
+import { ref, watch } from 'vue';
+
+export function useMeasurementLengthTool() {
+  const viewer3cr = useViewer3cr();
+
+  const isActive = ref<boolean>(false);
+
+  watch(isActive, async (isActive) => {
+    await lengthTool(isActive);
+  });
+
+  async function lengthTool(value: boolean): Promise<void> {
+    const message: InteractivityState = { Version: '0.0.0', Value: value };
+    await viewer3cr.lengthTool({ message });
+  }
+
+  return { isActive };
+}

package/src/tools/measurement-polygon.tool.ts

@@ -0,0 +1,20 @@
+import { InteractivityState } from '@3cr/types-ts';
+import { useViewer3cr } from '@/composables/useViewer3cr';
+import { ref, watch } from 'vue';
+
+export function useMeasurementPolygonTool() {
+  const viewer3cr = useViewer3cr();
+
+  const isActive = ref<boolean>(false);
+
+  watch(isActive, async (isActive) => {
+    await polygonTool(isActive);
+  });
+
+  async function polygonTool(value: boolean): Promise<void> {
+    const message: InteractivityState = { Version: '0.0.0', Value: value };
+    await viewer3cr.polygonTool({ message });
+  }
+
+  return { isActive };
+}

package/src/types/feature.ts

@@ -0,0 +1,6 @@
+export interface Feature {
+  title: string;
+  version: string;
+  createdAt: Date;
+  html: string;
+}

package/src/types/viewer-tool.ts

@@ -0,0 +1,5 @@
+import { Ref } from 'vue';
+
+export interface ViewerTool {
+  isActive: Ref<boolean>;
+}

package/test/MockImportOriginal.ts

@@ -0,0 +1,7 @@
+import { MockInstance } from '@vitest/spy';
+
+export type MockImportOriginal<T> = () => Promise<T>;
+
+export function AsMock(mock: any): MockInstance {
+  return mock as MockInstance;
+}

package/test/assertions/beTypeOrNull.ts

@@ -0,0 +1,24 @@
+import { ExpectationResult } from '@vitest/expect';
+
+expect.extend({
+  toBeTypeOrNull(received: any, constructor: unknown): ExpectationResult {
+    const { isNot } = this;
+    try {
+      expect(received).toEqual(expect.any(constructor));
+      return {
+        message: () => `Ok`,
+        pass: true
+      };
+    } catch (error) {
+      return received === null
+        ? {
+            message: () => `Ok`,
+            pass: true
+          }
+        : {
+            message: () => `expected ${received} is${isNot ? ' not' : ''} to be ${constructor} type or null`,
+            pass: false
+          };
+    }
+  }
+});

package/test/fakers/action-data.faker.ts

@@ -1,5 +1,5 @@
-import { ActionData } from '@/types/action-data';
 import { faker } from '@faker-js/faker';
+import { ActionData } from '@3cr/viewer-types-ts';
 
 export class ActionDataFaker {
   static random(): ActionData {

package/test/fakers/action.faker.ts

@@ -1,6 +1,6 @@
-import { Action, ActionRaw } from '@/types/action';
 import { faker } from '@faker-js/faker';
 import { ActionDataFaker } from '@test/fakers/action-data.faker';
+import { Action, ActionRaw } from '@3cr/viewer-types-ts';
 
 export class ActionFaker {
   static random(): Action {

package/test/fakers/call-to-action.faker.ts

@@ -1,6 +1,6 @@
-import { CallToAction, CallToActionRaw } from '@/types/call-to-action';
 import { faker } from '@faker-js/faker';
 import { ActionFaker } from '@test/fakers/action.faker';
+import { CallToAction, CallToActionRaw } from '@3cr/viewer-types-ts';
 
 export class CallToActionFaker {
   static random(): CallToAction {

package/test/fakers/data-overlay-angle.faker.ts

@@ -1,9 +1,9 @@
-import { DataOverlayAngle, DataOverlayAngleRaw } from '@/types/data-overlay-angle';
 import { faker } from '@faker-js/faker';
 import { Vector3Faker } from '@test/fakers/vector3.faker';
 import { InvertTransformFaker } from '@test/fakers/invert-transform.faker';
 import { SegmentAngleFaker } from '@test/fakers/segment-angle.faker';
 import { CallToActionFaker } from '@test/fakers/call-to-action.faker';
+import { DataOverlayAngle, DataOverlayAngleRaw } from '@3cr/viewer-types-ts';
 
 export class DataOverlayAngleFaker {
   static random(): DataOverlayAngle {

package/test/fakers/data-overlay-annotation.faker.ts

@@ -1,10 +1,10 @@
 import { faker } from '@faker-js/faker';
-import { DataOverlayAnnotation, DataOverlayAnnotationRaw } from '@/types/data-overlay-annotation';
 import { Vector3Faker } from '@test/fakers/vector3.faker';
 import { InvertTransformFaker } from '@test/fakers/invert-transform.faker';
 import { ColourFaker } from '@test/fakers/colour.faker';
 import { Vector2Faker } from '@test/fakers/vector2.faker';
 import { CallToActionFaker } from '@test/fakers/call-to-action.faker';
+import { DataOverlayAnnotation, DataOverlayAnnotationRaw } from '@3cr/viewer-types-ts';
 
 export class DataOverlayAnnotationFaker {
   static random(): DataOverlayAnnotation {