@energy8platform/game-engine 0.33.4 → 0.33.6

package/dist/scene.esm.js

@@ -3129,17 +3129,21 @@ const reelGridContribution = {
             system.setBoard(board.map((column) => column.map((cell) => (typeof cell === 'string' ? { symbol: cell } : cell))));
         };
         setBoard(props.board);
-        // The reel system's local content does not start at (0,0) (cells/decoration extend
-        // around the geometry origin), so align it inside a wrapper: measure() re-reads the
-        // real local bounds each layout and keeps the wrapper's (0,0) = content top-left.
+        // The reel system's local content does not start at (0,0) (cells center on geometry
+        // positions), so align it inside a wrapper. The origin comes from the STATIC geometry
+        // (first cell center − half cell), never from getLocalBounds — animated cells hang
+        // far outside the window mid-spin and a bounds-based origin would drift the grid.
         const wrapper = new Container();
         wrapper.addChild(system.view);
-        let contentOrigin = { x: 0, y: 0 };
+        const contentOrigin = { x: 0, y: 0 };
         const syncContent = () => {
-            const lb = system.view.getLocalBounds();
-            contentOrigin = { x: lb.x, y: lb.y };
-            system.view.position.set(-lb.x, -lb.y);
-            return { width: lb.width, height: lb.height };
+            const geom = system.grid.geometry;
+            const first = system.grid.cellPosition(0, 0);
+            const cell = system.config.grid.cellSize;
+            contentOrigin.x = first.x - cell / 2;
+            contentOrigin.y = first.y - cell / 2;
+            system.view.position.set(-contentOrigin.x, -contentOrigin.y);
+            return { width: geom.gridW, height: geom.gridH };
         };
         const instance = {
             view: wrapper,