Sorted imports

src/components/Effects.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script setup lang="ts">
-import { Scene } from 'phavuer'
-import { useZoneStore } from '@/stores/zoneStore'
-import { useGameStore } from '@/stores/gameStore'
-import { onBeforeUnmount, onMounted, ref, watch } from 'vue'
 import type { WeatherState } from '@/application/types'
+import { useGameStore } from '@/stores/gameStore'
+import { useZoneStore } from '@/stores/zoneStore'
+import { Scene } from 'phavuer'
+import { onBeforeUnmount, onMounted, ref, watch } from 'vue'
 
 // Constants
 const LIGHT_CONFIG = {

src/components/game/character/Character.vue

@@ -11,15 +11,16 @@
 <script lang="ts" setup>
 import config from '@/application/config'
 import { type Sprite as SpriteT, type ZoneCharacter } from '@/application/types'
-import { useGameStore } from '@/stores/gameStore'
-import { useZoneStore } from '@/stores/zoneStore'
-import { watch, computed, ref, onMounted, onUnmounted } from 'vue'
-import { Container, refObj, Sprite, useScene } from 'phavuer'
-import { calculateIsometricDepth, tileToWorldX, tileToWorldY } from '@/composables/zoneComposable'
-import { loadSpriteTextures } from '@/composables/gameComposable'
+import CharacterHair from '@/components/game/character/partials/CharacterHair.vue'
 import ChatBubble from '@/components/game/character/partials/ChatBubble.vue'
 import Healthbar from '@/components/game/character/partials/Healthbar.vue'
-import CharacterHair from '@/components/game/character/partials/CharacterHair.vue'
+import { loadSpriteTextures } from '@/composables/gameComposable'
+import { calculateIsometricDepth, tileToWorldX, tileToWorldY } from '@/composables/zoneComposable'
+import { useGameStore } from '@/stores/gameStore'
+import { useZoneStore } from '@/stores/zoneStore'
+import { Container, refObj, Sprite, useScene } from 'phavuer'
+import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
+
 // import CharacterChest from '@/components/game/character/partials/CharacterChest.vue'
 
 enum Direction {
@@ -137,11 +138,14 @@ watch(
     if (!newValues) return
 
     if (!oldValues || newValues.x !== oldValues.x || newValues.y !== oldValues.y) {
-      const direction = !oldValues
-        ? Direction.POSITIVE
-        : calcDirection(oldValues.x, oldValues.y, newValues.x, newValues.y)
+      const direction = !oldValues ? Direction.POSITIVE : calcDirection(oldValues.x, oldValues.y, newValues.x, newValues.y)
       updatePosition(newValues.x, newValues.y, direction)
     }
+
+    // Handle animation updates
+    if (newValues.isMoving !== oldValues?.isMoving || newValues.rotation !== oldValues?.rotation) {
+      updateSprite()
+    }
   },
   { deep: true }
 )

src/components/game/character/partials/CharacterChest.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script lang="ts" setup>
-import { computed } from 'vue'
-import { Image, useScene } from 'phavuer'
 import type { Sprite as SpriteT, ZoneCharacter } from '@/application/types'
 import { loadSpriteTextures } from '@/composables/gameComposable'
 import { useGameStore } from '@/stores/gameStore'
+import { Image, useScene } from 'phavuer'
+import { computed } from 'vue'
 
 const props = defineProps<{
   zoneCharacter: ZoneCharacter

src/components/game/character/partials/CharacterHair.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script lang="ts" setup>
-import { computed } from 'vue'
-import { Image, useScene } from 'phavuer'
 import type { Sprite as SpriteT, ZoneCharacter } from '@/application/types'
 import { loadSpriteTextures } from '@/composables/gameComposable'
 import { useGameStore } from '@/stores/gameStore'
+import { Image, useScene } from 'phavuer'
+import { computed } from 'vue'
 
 const props = defineProps<{
   zoneCharacter: ZoneCharacter

src/components/game/character/partials/ChatBubble.vue

@@ -6,8 +6,8 @@
 </template>
 
 <script setup lang="ts">
-import { Container, refObj, RoundRectangle, Text, useGame } from 'phavuer'
 import type { ZoneCharacter } from '@/application/types'
+import { Container, refObj, RoundRectangle, Text, useGame } from 'phavuer'
 import { onMounted } from 'vue'
 
 const props = defineProps<{

src/components/game/character/partials/Healthbar.vue

@@ -7,8 +7,8 @@
 </template>
 
 <script setup lang="ts">
-import { Container, RoundRectangle, Text, useGame } from 'phavuer'
 import type { ZoneCharacter } from '@/application/types'
+import { Container, RoundRectangle, Text, useGame } from 'phavuer'
 
 const props = defineProps<{
   zoneCharacter: ZoneCharacter

src/components/game/zone/Zone.vue

@@ -5,15 +5,15 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onUnmounted } from 'vue'
-import { useScene } from 'phavuer'
+import type { ZoneCharacter, zoneLoadData } from '@/application/types'
+import Characters from '@/components/game/zone/Characters.vue'
+import ZoneObjects from '@/components/game/zone/ZoneObjects.vue'
+import ZoneTiles from '@/components/game/zone/ZoneTiles.vue'
+import { loadZoneTilesIntoScene } from '@/composables/zoneComposable'
 import { useGameStore } from '@/stores/gameStore'
 import { useZoneStore } from '@/stores/zoneStore'
-import { loadZoneTilesIntoScene } from '@/composables/zoneComposable'
-import type { ZoneCharacter, zoneLoadData } from '@/application/types'
-import ZoneTiles from '@/components/game/zone/ZoneTiles.vue'
-import ZoneObjects from '@/components/game/zone/ZoneObjects.vue'
-import Characters from '@/components/game/zone/Characters.vue'
+import { useScene } from 'phavuer'
+import { onUnmounted, ref } from 'vue'
 
 const scene = useScene()
 const gameStore = useGameStore()

src/components/game/zone/ZoneObjects.vue

@@ -3,8 +3,8 @@
 </template>
 
 <script setup lang="ts">
-import { useZoneStore } from '@/stores/zoneStore'
 import ZoneObject from '@/components/game/zone/partials/ZoneObject.vue'
+import { useZoneStore } from '@/stores/zoneStore'
 
 const zoneStore = useZoneStore()
 

src/components/game/zone/ZoneTiles.vue

@@ -4,12 +4,12 @@
 
 <script setup lang="ts">
 import config from '@/application/config'
-import { useScene } from 'phavuer'
-import { useZoneStore } from '@/stores/zoneStore'
-import { onBeforeUnmount } from 'vue'
-import { FlattenZoneArray, setLayerTiles } from '@/composables/zoneComposable'
-import Controls from '@/components/utilities/Controls.vue'
 import { unduplicateArray } from '@/application/utilities'
+import Controls from '@/components/utilities/Controls.vue'
+import { FlattenZoneArray, setLayerTiles } from '@/composables/zoneComposable'
+import { useZoneStore } from '@/stores/zoneStore'
+import { useScene } from 'phavuer'
+import { onBeforeUnmount } from 'vue'
 
 const emit = defineEmits(['tileMap:create'])
 

src/components/game/zone/partials/ZoneObject.vue

@@ -3,12 +3,12 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue'
-import { Image, useScene } from 'phavuer'
-import { calculateIsometricDepth, tileToWorldX, tileToWorldY } from '@/composables/zoneComposable'
-import { loadTexture } from '@/composables/gameComposable'
 import type { AssetDataT, ZoneObject } from '@/application/types'
+import { loadTexture } from '@/composables/gameComposable'
+import { calculateIsometricDepth, tileToWorldX, tileToWorldY } from '@/composables/zoneComposable'
 import { useGameStore } from '@/stores/gameStore'
+import { Image, useScene } from 'phavuer'
+import { computed } from 'vue'
 
 const props = defineProps<{
   tilemap: Phaser.Tilemaps.Tilemap

src/components/gameMaster/GmPanel.vue

@@ -18,11 +18,11 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
-import Modal from '@/components/utilities/Modal.vue'
 import AssetManager from '@/components/gameMaster/assetManager/AssetManager.vue'
+import Modal from '@/components/utilities/Modal.vue'
 import { useGameStore } from '@/stores/gameStore'
 import { useZoneEditorStore } from '@/stores/zoneEditorStore'
+import { ref } from 'vue'
 
 const gameStore = useGameStore()
 const zoneEditorStore = useZoneEditorStore()

src/components/gameMaster/assetManager/AssetManager.vue

@@ -60,20 +60,20 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
-import { useAssetManagerStore } from '@/stores/assetManagerStore'
-import TileList from '@/components/gameMaster/assetManager/partials/tile/TileList.vue'
-import TileDetails from '@/components/gameMaster/assetManager/partials/tile/TileDetails.vue'
-import ObjectList from '@/components/gameMaster/assetManager/partials/object/ObjectList.vue'
-import ObjectDetails from '@/components/gameMaster/assetManager/partials/object/ObjectDetails.vue'
-import SpriteList from '@/components/gameMaster/assetManager/partials/sprite/SpriteList.vue'
-import SpriteDetails from '@/components/gameMaster/assetManager/partials/sprite/SpriteDetails.vue'
-import CharacterTypeList from '@/components/gameMaster/assetManager/partials/characterType/CharacterTypeList.vue'
-import CharacterTypeDetails from '@/components/gameMaster/assetManager/partials/characterType/CharacterTypeDetails.vue'
-import CharacterHairList from '@/components/gameMaster/assetManager/partials/characterHair/CharacterHairList.vue'
 import CharacterHairDetails from '@/components/gameMaster/assetManager/partials/characterHair/CharacterHairDetails.vue'
-import ItemList from '@/components/gameMaster/assetManager/partials/item/itemList.vue'
+import CharacterHairList from '@/components/gameMaster/assetManager/partials/characterHair/CharacterHairList.vue'
+import CharacterTypeDetails from '@/components/gameMaster/assetManager/partials/characterType/CharacterTypeDetails.vue'
+import CharacterTypeList from '@/components/gameMaster/assetManager/partials/characterType/CharacterTypeList.vue'
 import ItemDetails from '@/components/gameMaster/assetManager/partials/item/itemDetails.vue'
+import ItemList from '@/components/gameMaster/assetManager/partials/item/itemList.vue'
+import ObjectDetails from '@/components/gameMaster/assetManager/partials/object/ObjectDetails.vue'
+import ObjectList from '@/components/gameMaster/assetManager/partials/object/ObjectList.vue'
+import SpriteDetails from '@/components/gameMaster/assetManager/partials/sprite/SpriteDetails.vue'
+import SpriteList from '@/components/gameMaster/assetManager/partials/sprite/SpriteList.vue'
+import TileDetails from '@/components/gameMaster/assetManager/partials/tile/TileDetails.vue'
+import TileList from '@/components/gameMaster/assetManager/partials/tile/TileList.vue'
+import { useAssetManagerStore } from '@/stores/assetManagerStore'
+import { ref } from 'vue'
 
 const assetManagerStore = useAssetManagerStore()
 const selectedCategory = ref('tiles')

src/components/gameMaster/assetManager/partials/characterHair/CharacterHairDetails.vue

@@ -34,10 +34,10 @@
 </template>
 
 <script setup lang="ts">
-import type { CharacterHair, CharacterGender, Sprite } from '@/application/types'
-import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
+import type { CharacterGender, CharacterHair, Sprite } from '@/application/types'
 import { useAssetManagerStore } from '@/stores/assetManagerStore'
 import { useGameStore } from '@/stores/gameStore'
+import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
 
 const gameStore = useGameStore()
 const assetManagerStore = useAssetManagerStore()

src/components/gameMaster/assetManager/partials/characterHair/CharacterHairList.vue

@@ -32,11 +32,11 @@
 </template>
 
 <script setup lang="ts">
-import { useGameStore } from '@/stores/gameStore'
-import { onMounted, ref, computed } from 'vue'
-import { useAssetManagerStore } from '@/stores/assetManagerStore'
 import type { CharacterHair } from '@/application/types'
+import { useAssetManagerStore } from '@/stores/assetManagerStore'
+import { useGameStore } from '@/stores/gameStore'
 import { useVirtualList } from '@vueuse/core'
+import { computed, onMounted, ref } from 'vue'
 
 const gameStore = useGameStore()
 const assetManagerStore = useAssetManagerStore()

src/components/gameMaster/assetManager/partials/characterType/CharacterTypeDetails.vue

@@ -40,10 +40,10 @@
 </template>
 
 <script setup lang="ts">
-import type { CharacterType, CharacterGender, CharacterRace, Sprite } from '@/application/types'
-import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
+import type { CharacterGender, CharacterRace, CharacterType, Sprite } from '@/application/types'
 import { useAssetManagerStore } from '@/stores/assetManagerStore'
 import { useGameStore } from '@/stores/gameStore'
+import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
 
 const gameStore = useGameStore()
 const assetManagerStore = useAssetManagerStore()

src/components/gameMaster/assetManager/partials/characterType/CharacterTypeList.vue

@@ -32,11 +32,11 @@
 </template>
 
 <script setup lang="ts">
-import { useGameStore } from '@/stores/gameStore'
-import { onMounted, ref, computed } from 'vue'
-import { useAssetManagerStore } from '@/stores/assetManagerStore'
 import type { CharacterType } from '@/application/types'
+import { useAssetManagerStore } from '@/stores/assetManagerStore'
+import { useGameStore } from '@/stores/gameStore'
 import { useVirtualList } from '@vueuse/core'
+import { computed, onMounted, ref } from 'vue'
 
 const gameStore = useGameStore()
 const assetManagerStore = useAssetManagerStore()

src/components/gameMaster/assetManager/partials/item/itemDetails.vue

@@ -44,10 +44,10 @@
 </template>
 
 <script setup lang="ts">
-import type { Item, ItemType, ItemRarity } from '@/application/types'
-import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
+import type { Item, ItemRarity, ItemType } from '@/application/types'
 import { useAssetManagerStore } from '@/stores/assetManagerStore'
 import { useGameStore } from '@/stores/gameStore'
+import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
 
 const gameStore = useGameStore()
 const assetManagerStore = useAssetManagerStore()

src/components/gameMaster/assetManager/partials/item/itemList.vue

@@ -29,11 +29,11 @@
 </template>
 
 <script setup lang="ts">
-import { useGameStore } from '@/stores/gameStore'
-import { onMounted, ref, computed } from 'vue'
-import { useAssetManagerStore } from '@/stores/assetManagerStore'
 import type { Item } from '@/application/types'
+import { useAssetManagerStore } from '@/stores/assetManagerStore'
+import { useGameStore } from '@/stores/gameStore'
 import { useVirtualList } from '@vueuse/core'
+import { computed, onMounted, ref } from 'vue'
 
 const gameStore = useGameStore()
 const assetManagerStore = useAssetManagerStore()

src/components/gameMaster/assetManager/partials/object/ObjectDetails.vue

@@ -50,13 +50,13 @@
 </template>
 
 <script setup lang="ts">
-import type { Object } from '@/application/types'
-import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
-import { useAssetManagerStore } from '@/stores/assetManagerStore'
-import { useZoneEditorStore } from '@/stores/zoneEditorStore'
-import { useGameStore } from '@/stores/gameStore'
 import config from '@/application/config'
+import type { Object } from '@/application/types'
 import ChipsInput from '@/components/forms/ChipsInput.vue'
+import { useAssetManagerStore } from '@/stores/assetManagerStore'
+import { useGameStore } from '@/stores/gameStore'
+import { useZoneEditorStore } from '@/stores/zoneEditorStore'
+import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
 
 const gameStore = useGameStore()
 const assetManagerStore = useAssetManagerStore()

src/components/gameMaster/assetManager/partials/object/ObjectList.vue

@@ -29,11 +29,11 @@
 
 <script setup lang="ts">
 import config from '@/application/config'
-import { useGameStore } from '@/stores/gameStore'
-import { onMounted, ref, computed } from 'vue'
-import { useAssetManagerStore } from '@/stores/assetManagerStore'
 import type { Object } from '@/application/types'
+import { useAssetManagerStore } from '@/stores/assetManagerStore'
+import { useGameStore } from '@/stores/gameStore'
 import { useVirtualList } from '@vueuse/core'
+import { computed, onMounted, ref } from 'vue'
 
 const gameStore = useGameStore()
 const objectUploadField = ref(null)

src/components/gameMaster/assetManager/partials/sprite/SpriteDetails.vue

@@ -70,12 +70,12 @@
 
 <script setup lang="ts">
 import type { Sprite, SpriteAction } from '@/application/types'
-import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
+import { uuidv4 } from '@/application/utilities'
+import SpriteActionsInput from '@/components/gameMaster/assetManager/partials/sprite/partials/SpriteImagesInput.vue'
+import Accordion from '@/components/utilities/Accordion.vue'
 import { useAssetManagerStore } from '@/stores/assetManagerStore'
 import { useGameStore } from '@/stores/gameStore'
-import Accordion from '@/components/utilities/Accordion.vue'
-import SpriteActionsInput from '@/components/gameMaster/assetManager/partials/sprite/partials/SpriteImagesInput.vue'
-import { uuidv4 } from '@/application/utilities'
+import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
 
 const gameStore = useGameStore()
 const assetManagerStore = useAssetManagerStore()

src/components/gameMaster/assetManager/partials/sprite/SpriteList.vue

@@ -25,11 +25,11 @@
 
 <script setup lang="ts">
 import config from '@/application/config'
-import { useGameStore } from '@/stores/gameStore'
-import { onMounted, ref, computed } from 'vue'
-import { useAssetManagerStore } from '@/stores/assetManagerStore'
-import { useVirtualList } from '@vueuse/core'
 import type { Sprite } from '@/application/types'
+import { useAssetManagerStore } from '@/stores/assetManagerStore'
+import { useGameStore } from '@/stores/gameStore'
+import { useVirtualList } from '@vueuse/core'
+import { computed, onMounted, ref } from 'vue'
 
 const gameStore = useGameStore()
 const assetManagerStore = useAssetManagerStore()

src/components/gameMaster/assetManager/partials/tile/TileDetails.vue

@@ -23,13 +23,13 @@
 </template>
 
 <script setup lang="ts">
-import type { Tile } from '@/application/types'
-import { computed, onBeforeUnmount, onMounted, ref, toRaw, watch } from 'vue'
-import { useAssetManagerStore } from '@/stores/assetManagerStore'
-import { useZoneEditorStore } from '@/stores/zoneEditorStore'
-import { useGameStore } from '@/stores/gameStore'
 import config from '@/application/config'
+import type { Tile } from '@/application/types'
 import ChipsInput from '@/components/forms/ChipsInput.vue'
+import { useAssetManagerStore } from '@/stores/assetManagerStore'
+import { useGameStore } from '@/stores/gameStore'
+import { useZoneEditorStore } from '@/stores/zoneEditorStore'
+import { computed, onBeforeUnmount, onMounted, ref, toRaw, watch } from 'vue'
 
 const gameStore = useGameStore()
 const assetManagerStore = useAssetManagerStore()

src/components/gameMaster/assetManager/partials/tile/TileList.vue

@@ -29,11 +29,11 @@
 
 <script setup lang="ts">
 import config from '@/application/config'
-import { useGameStore } from '@/stores/gameStore'
-import { onMounted, ref, computed } from 'vue'
-import { useAssetManagerStore } from '@/stores/assetManagerStore'
 import type { Tile } from '@/application/types'
+import { useAssetManagerStore } from '@/stores/assetManagerStore'
+import { useGameStore } from '@/stores/gameStore'
 import { useVirtualList } from '@vueuse/core'
+import { computed, onMounted, ref } from 'vue'
 
 const gameStore = useGameStore()
 const tileUploadField = ref(null)

src/components/gameMaster/zoneEditor/ZoneEditor.vue

@@ -14,20 +14,20 @@
 </template>
 
 <script setup lang="ts">
-import { onUnmounted, ref } from 'vue'
-import { useGameStore } from '@/stores/gameStore'
-import { useZoneEditorStore } from '@/stores/zoneEditorStore'
 import { type Zone } from '@/application/types'
+import ObjectList from '@/components/gameMaster/zoneEditor/partials/ObjectList.vue'
+import TeleportModal from '@/components/gameMaster/zoneEditor/partials/TeleportModal.vue'
+import TileList from '@/components/gameMaster/zoneEditor/partials/TileList.vue'
 // Components
 import Toolbar from '@/components/gameMaster/zoneEditor/partials/Toolbar.vue'
-import TileList from '@/components/gameMaster/zoneEditor/partials/TileList.vue'
-import ObjectList from '@/components/gameMaster/zoneEditor/partials/ObjectList.vue'
-import ZoneSettings from '@/components/gameMaster/zoneEditor/partials/ZoneSettings.vue'
 import ZoneList from '@/components/gameMaster/zoneEditor/partials/ZoneList.vue'
-import TeleportModal from '@/components/gameMaster/zoneEditor/partials/TeleportModal.vue'
-import ZoneTiles from '@/components/gameMaster/zoneEditor/zonePartials/ZoneTiles.vue'
-import ZoneObjects from '@/components/gameMaster/zoneEditor/zonePartials/ZoneObjects.vue'
+import ZoneSettings from '@/components/gameMaster/zoneEditor/partials/ZoneSettings.vue'
 import ZoneEventTiles from '@/components/gameMaster/zoneEditor/zonePartials/ZoneEventTiles.vue'
+import ZoneObjects from '@/components/gameMaster/zoneEditor/zonePartials/ZoneObjects.vue'
+import ZoneTiles from '@/components/gameMaster/zoneEditor/zonePartials/ZoneTiles.vue'
+import { useGameStore } from '@/stores/gameStore'
+import { useZoneEditorStore } from '@/stores/zoneEditorStore'
+import { onUnmounted, ref } from 'vue'
 
 const gameStore = useGameStore()
 const zoneEditorStore = useZoneEditorStore()

src/components/gameMaster/zoneEditor/partials/CreateZone.vue

@@ -36,11 +36,11 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
+import type { Zone } from '@/application/types'
 import Modal from '@/components/utilities/Modal.vue'
 import { useGameStore } from '@/stores/gameStore'
 import { useZoneEditorStore } from '@/stores/zoneEditorStore'
-import type { Zone } from '@/application/types'
+import { ref } from 'vue'
 
 const gameStore = useGameStore()
 const zoneEditorStore = useZoneEditorStore()

src/components/gameMaster/zoneEditor/partials/ObjectList.vue

@@ -42,11 +42,11 @@
 
 <script setup lang="ts">
 import config from '@/application/config'
-import { ref, onMounted, computed } from 'vue'
-import { useZoneEditorStore } from '@/stores/zoneEditorStore'
-import { useGameStore } from '@/stores/gameStore'
-import Modal from '@/components/utilities/Modal.vue'
 import type { Object, ZoneObject } from '@/application/types'
+import Modal from '@/components/utilities/Modal.vue'
+import { useGameStore } from '@/stores/gameStore'
+import { useZoneEditorStore } from '@/stores/zoneEditorStore'
+import { computed, onMounted, ref } from 'vue'
 
 const gameStore = useGameStore()
 const isModalOpen = ref(false)

src/components/gameMaster/zoneEditor/partials/TeleportModal.vue

@@ -39,11 +39,11 @@
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted, ref, watch } from 'vue'
-import Modal from '@/components/utilities/Modal.vue'
-import { useZoneEditorStore } from '@/stores/zoneEditorStore'
-import { useGameStore } from '@/stores/gameStore'
 import type { Zone } from '@/application/types'
+import Modal from '@/components/utilities/Modal.vue'
+import { useGameStore } from '@/stores/gameStore'
+import { useZoneEditorStore } from '@/stores/zoneEditorStore'
+import { computed, onMounted, ref, watch } from 'vue'
 
 const showTeleportModal = computed(() => zoneEditorStore.tool === 'pencil' && zoneEditorStore.drawMode === 'teleport')
 const zoneEditorStore = useZoneEditorStore()

src/components/gameMaster/zoneEditor/partials/TileList.vue

@@ -82,11 +82,11 @@
 
 <script setup lang="ts">
 import config from '@/application/config'
-import { ref, onMounted, computed } from 'vue'
-import { useZoneEditorStore } from '@/stores/zoneEditorStore'
-import { useGameStore } from '@/stores/gameStore'
-import Modal from '@/components/utilities/Modal.vue'
 import type { Tile } from '@/application/types'
+import Modal from '@/components/utilities/Modal.vue'
+import { useGameStore } from '@/stores/gameStore'
+import { useZoneEditorStore } from '@/stores/zoneEditorStore'
+import { computed, onMounted, ref } from 'vue'
 
 const gameStore = useGameStore()
 const isModalOpen = ref(false)

src/components/gameMaster/zoneEditor/partials/Toolbar.vue

@@ -82,9 +82,9 @@
 </template>
 
 <script setup lang="ts">
-import { onBeforeUnmount, onMounted, ref } from 'vue'
 import { useZoneEditorStore } from '@/stores/zoneEditorStore'
 import { onClickOutside } from '@vueuse/core'
+import { onBeforeUnmount, onMounted, ref } from 'vue'
 
 const zoneEditorStore = useZoneEditorStore()
 

src/components/gameMaster/zoneEditor/partials/ZoneList.vue

@@ -26,12 +26,12 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted } from 'vue'
-import { useGameStore } from '@/stores/gameStore'
-import Modal from '@/components/utilities/Modal.vue'
 import type { Zone } from '@/application/types'
-import { useZoneEditorStore } from '@/stores/zoneEditorStore'
 import CreateZone from '@/components/gameMaster/zoneEditor/partials/CreateZone.vue'
+import Modal from '@/components/utilities/Modal.vue'
+import { useGameStore } from '@/stores/gameStore'
+import { useZoneEditorStore } from '@/stores/zoneEditorStore'
+import { onMounted } from 'vue'
 
 const gameStore = useGameStore()
 const zoneEditorStore = useZoneEditorStore()

src/components/gameMaster/zoneEditor/partials/ZoneSettings.vue

@@ -47,9 +47,9 @@
 </template>
 
 <script setup>
-import { ref, watch } from 'vue'
 import Modal from '@/components/utilities/Modal.vue'
 import { useZoneEditorStore } from '@/stores/zoneEditorStore'
+import { ref, watch } from 'vue'
 
 const zoneEditorStore = useZoneEditorStore()
 const screen = ref('settings')

src/components/gameMaster/zoneEditor/zonePartials/ZoneEventTiles.vue

@@ -3,11 +3,11 @@
 </template>
 
 <script setup lang="ts">
-import { type ZoneEventTile, ZoneEventTileType } from '@/application/types'
+import { ZoneEventTileType, type ZoneEventTile } from '@/application/types'
+import { uuidv4 } from '@/application/utilities'
+import { getTile, tileToWorldX, tileToWorldY } from '@/composables/zoneComposable'
 import { useZoneEditorStore } from '@/stores/zoneEditorStore'
 import { Image, useScene } from 'phavuer'
-import { getTile, tileToWorldX, tileToWorldY } from '@/composables/zoneComposable'
-import { uuidv4 } from '@/application/utilities'
 import { onMounted, onUnmounted } from 'vue'
 
 const scene = useScene()

src/components/gameMaster/zoneEditor/zonePartials/ZoneObject.vue

@@ -3,12 +3,12 @@
 </template>
 
 <script setup lang="ts">
-import { computed } from 'vue'
-import { Image, useScene } from 'phavuer'
-import { calculateIsometricDepth, tileToWorldX, tileToWorldY } from '@/composables/zoneComposable'
-import { loadTexture } from '@/composables/gameComposable'
 import type { AssetDataT, ZoneObject } from '@/application/types'
+import { loadTexture } from '@/composables/gameComposable'
+import { calculateIsometricDepth, tileToWorldX, tileToWorldY } from '@/composables/zoneComposable'
 import { useGameStore } from '@/stores/gameStore'
+import { Image, useScene } from 'phavuer'
+import { computed } from 'vue'
 
 const props = defineProps<{
   tilemap: Phaser.Tilemaps.Tilemap

src/components/gameMaster/zoneEditor/zonePartials/ZoneObjects.vue

@@ -4,14 +4,14 @@
 </template>
 
 <script setup lang="ts">
-import { uuidv4 } from '@/application/utilities'
-import { getTile } from '@/composables/zoneComposable'
-import { useScene } from 'phavuer'
-import { useZoneEditorStore } from '@/stores/zoneEditorStore'
-import SelectedZoneObject from '@/components/gameMaster/zoneEditor/partials/SelectedZoneObject.vue'
-import { onMounted, onUnmounted, ref, watch } from 'vue'
-import ZoneObject from '@/components/gameMaster/zoneEditor/zonePartials/ZoneObject.vue'
 import type { ZoneObject as ZoneObjectT } from '@/application/types'
+import { uuidv4 } from '@/application/utilities'
+import SelectedZoneObject from '@/components/gameMaster/zoneEditor/partials/SelectedZoneObject.vue'
+import ZoneObject from '@/components/gameMaster/zoneEditor/zonePartials/ZoneObject.vue'
+import { getTile } from '@/composables/zoneComposable'
+import { useZoneEditorStore } from '@/stores/zoneEditorStore'
+import { useScene } from 'phavuer'
+import { onMounted, onUnmounted, ref, watch } from 'vue'
 
 const scene = useScene()
 const zoneEditorStore = useZoneEditorStore()

src/components/gameMaster/zoneEditor/zonePartials/ZoneTiles.vue

@@ -4,13 +4,13 @@
 
 <script setup lang="ts">
 import config from '@/application/config'
-import { useScene } from 'phavuer'
-import { useZoneEditorStore } from '@/stores/zoneEditorStore'
-import { onMounted, onUnmounted, watch } from 'vue'
-import { createTileArray, getTile, placeTile, setLayerTiles } from '@/composables/zoneComposable'
-import Controls from '@/components/utilities/Controls.vue'
-import { useGameStore } from '@/stores/gameStore'
 import type { AssetDataT } from '@/application/types'
+import Controls from '@/components/utilities/Controls.vue'
+import { createTileArray, getTile, placeTile, setLayerTiles } from '@/composables/zoneComposable'
+import { useGameStore } from '@/stores/gameStore'
+import { useZoneEditorStore } from '@/stores/zoneEditorStore'
+import { useScene } from 'phavuer'
+import { onMounted, onUnmounted, watch } from 'vue'
 
 const emit = defineEmits(['tileMap:create'])
 

src/components/gui/CharacterProfile.vue

@@ -118,8 +118,8 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, onUnmounted, ref, watch, computed } from 'vue'
 import { useGameStore } from '@/stores/gameStore'
+import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
 
 const gameStore = useGameStore()
 

src/components/gui/Chat.vue

@@ -21,12 +21,12 @@
 </template>
 
 <script setup lang="ts">
-import { onBeforeUnmount, ref, nextTick, onMounted } from 'vue'
-import { onClickOutside, useFocus } from '@vueuse/core'
-import { useGameStore } from '@/stores/gameStore'
 import type { Chat } from '@/application/types'
+import { useGameStore } from '@/stores/gameStore'
 import { useZoneStore } from '@/stores/zoneStore'
+import { onClickOutside, useFocus } from '@vueuse/core'
 import { useScene } from 'phavuer'
+import { nextTick, onBeforeUnmount, onMounted, ref } from 'vue'
 
 const scene = useScene()
 const gameStore = useGameStore()

src/components/gui/UserPanel.vue

@@ -30,12 +30,12 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
-import { useGameStore } from '@/stores/gameStore'
-import Inventory from '@/components/gui/partials/Inventory.vue'
-import Equipment from '@/components/gui/partials/Equipment.vue'
 import CharacterScreen from '@/components/gui/partials/CharacterScreen.vue'
+import Equipment from '@/components/gui/partials/Equipment.vue'
+import Inventory from '@/components/gui/partials/Inventory.vue'
 import Settings from '@/components/gui/partials/Settings.vue'
+import { useGameStore } from '@/stores/gameStore'
+import { ref } from 'vue'
 
 const gameStore = useGameStore()
 let userPanelScreen = ref('inventory')

src/components/gui/partials/Settings.vue

@@ -33,8 +33,8 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
 import CharacterSettings from '@/components/gui/partials/settings/CharacterSettings.vue'
+import { ref } from 'vue'
 
 let settingCategory = ref('character')
 </script>

src/components/login/LoginForm.vue

@@ -26,10 +26,10 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, ref } from 'vue'
 import { login } from '@/services/authentication'
 import { useGameStore } from '@/stores/gameStore'
 import { useCookies } from '@vueuse/integrations/useCookies'
+import { onMounted, ref } from 'vue'
 
 const emit = defineEmits(['openResetPasswordModal', 'switchToRegister'])
 

src/components/login/NewPasswordForm.vue

@@ -22,10 +22,10 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, ref } from 'vue'
 import { newPassword } from '@/services/authentication'
 import { useGameStore } from '@/stores/gameStore'
 import { useCookies } from '@vueuse/integrations/useCookies'
+import { onMounted, ref } from 'vue'
 
 const emit = defineEmits(['switchToLogin'])
 

src/components/login/RegisterForm.vue

@@ -26,10 +26,10 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, ref } from 'vue'
 import { login, register } from '@/services/authentication'
 import { useGameStore } from '@/stores/gameStore'
 import { useCookies } from '@vueuse/integrations/useCookies'
+import { onMounted, ref } from 'vue'
 
 const emit = defineEmits(['switchToLogin'])
 

src/components/login/ResetPasswordModal.vue

@@ -29,10 +29,10 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue'
-import { resetPassword } from '@/services/authentication'
 import Modal from '@/components/utilities/Modal.vue'
+import { resetPassword } from '@/services/authentication'
 import { useGameStore } from '@/stores/gameStore'
+import { ref } from 'vue'
 
 const emit = defineEmits(['close'])
 

src/components/screens/Characters.vue

@@ -126,10 +126,10 @@
 
 <script setup lang="ts">
 import config from '@/application/config'
+import { type CharacterHair, type Character as CharacterT, type Zone } from '@/application/types'
+import Modal from '@/components/utilities/Modal.vue'
 import { useGameStore } from '@/stores/gameStore'
 import { onBeforeUnmount, ref, watch } from 'vue'
-import Modal from '@/components/utilities/Modal.vue'
-import { type Character as CharacterT, type CharacterHair, type Zone } from '@/application/types'
 
 const gameStore = useGameStore()
 const isLoading = ref<boolean>(true)

src/components/screens/Game.vue

@@ -20,19 +20,19 @@
 <script setup lang="ts">
 import config from '@/application/config'
 import 'phaser'
-import { Game, Scene } from 'phavuer'
-import { useGameStore } from '@/stores/gameStore'
-import Menu from '@/components/gui/Menu.vue'
-import ExpBar from '@/components/gui/ExpBar.vue'
-import Hud from '@/components/gui/Hud.vue'
-import Zone from '@/components/game/zone/Zone.vue'
-import Hotkeys from '@/components/gui/Hotkeys.vue'
-import Chat from '@/components/gui/Chat.vue'
-import CharacterProfile from '@/components/gui/CharacterProfile.vue'
 import Effects from '@/components/Effects.vue'
+import Zone from '@/components/game/zone/Zone.vue'
+import CharacterProfile from '@/components/gui/CharacterProfile.vue'
+import Chat from '@/components/gui/Chat.vue'
 // import Minimap from '@/components/gui/Minimap.vue'
 import Clock from '@/components/gui/Clock.vue'
+import ExpBar from '@/components/gui/ExpBar.vue'
+import Hotkeys from '@/components/gui/Hotkeys.vue'
+import Hud from '@/components/gui/Hud.vue'
+import Menu from '@/components/gui/Menu.vue'
+import { useGameStore } from '@/stores/gameStore'
 import AwaitLoaderPlugin from 'phaser3-rex-plugins/plugins/awaitloader-plugin'
+import { Game, Scene } from 'phavuer'
 
 const gameStore = useGameStore()
 

src/components/screens/Login.vue

@@ -26,13 +26,13 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, ref } from 'vue'
+import LoginForm from '@/components/login/LoginForm.vue'
+import NewPasswordForm from '@/components/login/NewPasswordForm.vue'
+import RegisterForm from '@/components/login/RegisterForm.vue'
+import ResetPassword from '@/components/login/ResetPasswordModal.vue'
 import { useGameStore } from '@/stores/gameStore'
 import { useCookies } from '@vueuse/integrations/useCookies'
-import LoginForm from '@/components/login/LoginForm.vue'
-import RegisterForm from '@/components/login/RegisterForm.vue'
-import NewPasswordForm from '@/components/login/NewPasswordForm.vue'
-import ResetPassword from '@/components/login/ResetPasswordModal.vue'
+import { onMounted, ref } from 'vue'
 
 const isPasswordResetFormShown = ref(false)
 const doesUrlHaveToken = ref(window.location.hash !== '')

src/components/screens/ZoneEditor.vue

@@ -11,13 +11,13 @@
 <script setup lang="ts">
 import config from '@/application/config'
 import 'phaser'
-import { Game, Scene } from 'phavuer'
+import type { AssetDataT } from '@/application/types'
+import ZoneEditor from '@/components/gameMaster/zoneEditor/ZoneEditor.vue'
+import { loadTexture } from '@/composables/gameComposable'
 import { useGameStore } from '@/stores/gameStore'
 import { useZoneEditorStore } from '@/stores/zoneEditorStore'
-import ZoneEditor from '@/components/gameMaster/zoneEditor/ZoneEditor.vue'
 import AwaitLoaderPlugin from 'phaser3-rex-plugins/plugins/awaitloader-plugin'
-import { loadTexture } from '@/composables/gameComposable'
-import type { AssetDataT } from '@/application/types'
+import { Game, Scene } from 'phavuer'
 
 const gameStore = useGameStore()
 const zoneEditorStore = useZoneEditorStore()

src/components/utilities/Controls.vue

@@ -3,10 +3,10 @@
 </template>
 
 <script setup lang="ts">
+import { useCameraControls } from '@/composables/useCameraControls'
+import { usePointerHandlers } from '@/composables/usePointerHandlers'
 import { Image, useScene } from 'phavuer'
 import { onBeforeUnmount, ref } from 'vue'
-import { usePointerHandlers } from '@/composables/usePointerHandlers'
-import { useCameraControls } from '@/composables/useCameraControls'
 
 // Types
 type WayPoint = { visible: boolean; x: number; y: number }

src/components/utilities/Notifications.vue

@@ -10,8 +10,8 @@
 </template>
 
 <script setup lang="ts">
-import { useGameStore } from '@/stores/gameStore'
 import Modal from '@/components/utilities/Modal.vue'
+import { useGameStore } from '@/stores/gameStore'
 import { onBeforeMount, onBeforeUnmount, onMounted, onUnmounted, watch } from 'vue'
 
 const gameStore = useGameStore()