Fix import statements and update dependencies

docs/.vitepress/config.js

@@ -1,4 +1,13 @@
 const apiMenu = [
+  {
+    text: 'Functions',
+    collapsed: false,
+    sidebarDepth: 2,
+    items: [
+      { text: "inject()", link: "/functions/inject" },
+    ]
+
+  },
   {
     text: 'Classes Server-Side',
     collapsed: false,
@@ -237,6 +246,7 @@ module.exports = {
     }
     ],
     sidebar: {
+      '/functions/': apiMenu,
       '/classes/': apiMenu,
       '/commands/': apiMenu,
       '/database/': apiMenu,

docs/functions/inject.md

@@ -0,0 +1,40 @@
+# Using `inject` in RPGJS
+
+The `inject` function in RPGJS is a powerful feature for dependency injection, allowing you to retrieve instances of various classes in both client and server environments.
+
+## Client-Side Injection
+
+To use `inject` on the client side, import it from `@rpgjs/client`. This allows you to retrieve singleton instances of classes such as `RpgClientEngine`, `KeyboardControls`, and `RpgRenderer`.
+
+### Retrieving the `RpgClientEngine`
+
+```typescript
+import { inject, RpgClientEngine } from '@rpgjs/client'
+
+const client = inject(RpgClientEngine)
+```
+
+This code imports `inject` and `RpgClientEngine` from `@rpgjs/client` and then uses `inject` to retrieve the `RpgClientEngine` instance.
+
+### Injecting Other Classes
+
+Similarly, you can inject other classes like `KeyboardControls` and `RpgRenderer`:
+
+```typescript
+import { inject, KeyboardControls, RpgRenderer } from '@rpgjs/client'
+
+const controls = inject(KeyboardControls)
+const renderer = inject(RpgRenderer)
+```
+
+## Server-Side Injection
+
+For server-side injection, import `inject` from `@rpgjs/server`. This is typically used to retrieve the `RpgServerEngine`.
+
+### Retrieving the `RpgServerEngine`
+
+```typescript
+import { inject, RpgServerEngine } from '@rpgjs/server'
+
+const server = inject(RpgServerEngine)
+```

packages/client/src/KeyboardControls.ts

@@ -1,4 +1,4 @@
-import { DefaultInput, Direction, InjectContext, Input, Utils, inject } from '@rpgjs/common'
+import { DefaultInput, Direction, InjectContext, Input, Utils } from '@rpgjs/common'
 import { ControlOptions, Controls } from '@rpgjs/types';
 import { RpgClientEngine } from './RpgClientEngine';
 
@@ -342,10 +342,11 @@ export class KeyboardControls {
      * From the name of the entry, we retrieve the control information
      * 
      * ```ts 
-     * import { Input } from '@rpgjs/client'
+     * import { Input, inject, KeyboardControls } from '@rpgjs/client'
      * 
-     * // In method hooks, client is RpgClientEngine
-     * client.controls.getControl(Input.Enter)
+     * const controls = inject(KeyboardControls)
+     * controls.getControl(Input.Enter)
+
      * if (control) {
      *    console.log(control.actionName) // action
      * }
@@ -364,19 +365,20 @@ export class KeyboardControls {
      * Triggers an input according to the name of the control
      * 
      * ```ts 
-     * import { Control } from '@rpgjs/client'
+     * import { Control, inject, KeyboardControls } from '@rpgjs/client'
      * 
-     * // In method hooks, client is RpgClientEngine
-     * client.controls.applyControl(Control.Action)
+     * const controls = inject(KeyboardControls)
+     * controls.applyControl(Control.Action)
      * ```
      * 
      * You can put a second parameter or indicate on whether the key is pressed or released
      * 
      * ```ts 
-     * import { Control } from '@rpgjs/client'
+     * import { Control, inject, KeyboardControls } from '@rpgjs/client'
      * 
-     * client.controls.applyControl(Control.Up, true) // keydown
-     * client.controls.applyControl(Control.Up, false) // keyup
+     * const controls = inject(KeyboardControls)
+     * controls.applyControl(Control.Up, true) // keydown
+     * controls.applyControl(Control.Up, false) // keyup
      * ```
      * @title Apply Control
      * @method applyControl(controlName,isDown)
@@ -441,10 +443,10 @@ export class KeyboardControls {
      *          * delay.otherControls {string | string[]} Indicates the other controls that will also have the delay at the same time
      * 
      * ```ts 
-     * import { Control, Input } from '@rpgjs/client'
+     * import { Control, Input, inject, KeyboardControls } from '@rpgjs/client'
      * 
-     * // In method hooks, client is RpgClientEngine
-     * client.controls.setInputs({
+     * const controls = inject(KeyboardControls)
+     * controls.setInputs({
             [Control.Up]: {
                 repeat: true,
                 bind: Input.Up

packages/client/src/Renderer.ts

@@ -1,4 +1,4 @@
-import { RpgPlugin, HookClient, Utils, inject, InjectContext } from '@rpgjs/common'
+import { RpgPlugin, HookClient, Utils, InjectContext } from '@rpgjs/common'
 import { SceneMap } from './Scene/Map'
 import { Scene } from './Scene/Scene'
 import { Scene as PresetScene } from './Presets/Scene'

packages/client/src/Resources.ts

@@ -1,5 +1,4 @@
 import { RpgClientEngine } from "./RpgClientEngine"
-import { Utils } from '@rpgjs/common'
 
 /**
 * Get/Set images in resources

packages/client/src/RpgClientEngine.ts

@@ -15,7 +15,6 @@ import {
     RpgCommonMap,
     Scheduler,
     Control,
-    inject,
     InjectContext,
 } from '@rpgjs/common'
 import { RpgSound } from './Sound/RpgSound'

packages/common/src/workers/move.ts

@@ -5,7 +5,7 @@ import { RpgCommonPlayer } from '../Player'
 
 const objects: any = {}
 let objectsByMap: any = {}
-const gameEngine = new RpgCommonGame(GameSide.Worker)
+const gameEngine = new RpgCommonGame()
 gameEngine.start({
   getObject(playerId) {
     return objects[playerId]