Refactor cameraControls and pointerHandlers, npm update, npm run format

src/components/gameMaster/zoneEditor/ZoneEditor.vue

@@ -250,9 +250,9 @@ function handleMove() {
 }
 
 function handleRotate(objectId: string) {
-  const object = zoneObjects.value.find(obj => obj.id === objectId);
+  const object = zoneObjects.value.find((obj) => obj.id === objectId)
   if (object) {
-    object.isRotated = !object.isRotated;
+    object.isRotated = !object.isRotated
   }
 }
 

src/components/sprites/Character.vue

@@ -1,16 +1,16 @@
 <template>
-<!--  Chat bubble -->
+  <!--  Chat bubble -->
   <Container ref="charChatContainer" :depth="999" :x="currentX" :y="currentY">
     <RoundRectangle @create="createChatBubble" :origin-x="0.5" :origin-y="7.5" :fillColor="0xffffff" :width="194" :height="21" :radius="20" />
     <Text @create="createChatText" text="" :origin-x="0.5" :origin-y="10.9" :style="{ fontSize: 13, fontFamily: 'Arial', color: '#000' }" />
   </Container>
-<!--  Character name and health -->
+  <!--  Character name and health -->
   <Container :depth="999" :x="currentX" :y="currentY">
     <Text @create="createText" :text="character.name" :origin-x="0.5" :origin-y="9" />
     <RoundRectangle :origin-x="0.5" :origin-y="18.5" :fillColor="0xffffff" :width="74" :height="6" :radius="5" />
     <RoundRectangle :origin-x="0.5" :origin-y="36.4" :fillColor="0x00b3b3" :width="70" :height="3" :radius="5" />
   </Container>
-<!--  Character sprite -->
+  <!--  Character sprite -->
   <Container ref="charContainer" :depth="isometricDepth" :x="currentX" :y="currentY">
     <Sprite ref="charSprite" :origin-y="1" :flipX="isFlippedX" :flipY="false" />
   </Container>

src/components/utilities/Controls.vue

@@ -8,18 +8,10 @@ import { onBeforeUnmount, ref } from 'vue'
 import { usePointerHandlers } from '@/composables/usePointerHandlers'
 import { useCameraControls } from '@/composables/useCameraControls'
 
-interface Props {
-  layer: Phaser.Tilemaps.TilemapLayer
-}
-
-const props = defineProps<Props>()
+const props = defineProps<{ layer: Phaser.Tilemaps.TilemapLayer }>()
 const scene = useScene()
 
-const waypoint = ref({
-  visible: false,
-  x: 0,
-  y: 0
-})
+const waypoint = ref({ visible: false, x: 0, y: 0 })
 
 const { camera } = useCameraControls(scene)
 const { setupPointerHandlers, cleanupPointerHandlers } = usePointerHandlers(scene, props.layer, waypoint, camera)