Move sprite generation state writes from web-ui to editor package

[Copilot]

Decouple Web-UI Sprite/Grid Writes

Goal

Move ownership of sprite generation outputs (spriteLookups) and grid sizing (hGrid/vGrid) from @8f4e/web-ui to the editor package, so that web-ui becomes read-only with respect to these state fields.

Implementation Complete

✅ All Success Criteria Met:

• Web-ui no longer writes to state.graphicHelper.spriteLookups, state.graphicHelper.viewport.hGrid, or state.graphicHelper.viewport.vGrid
• Editor owns sprite generation and grid sizing updates
• Rendering output and sprite sheet reloads remain consistent
• All tests pass
• Documentation updated

Changes Summary

Web-UI Package:

• Modified init to accept spriteData parameter
• Changed reloadSpriteSheet to return SpriteData
• Removed all state writes
• Exported types for consumers

Editor Package:

• Generates sprite data before web-ui initialization
• Updates state with sprite lookups and grid sizes
• spriteSheetManager handles sprite reload state updates
• Created updateStateWithSpriteData helper to eliminate duplication of state update logic

Tests:

• Moved sprite data generation into createMockStateWithColors helper
• All screenshot tests use shared helper for state updates
• All tests passing

Documentation:

• Updated web-ui README with new API
• Added clarifying comments for grid assignments

Original prompt

Please do this todo: docs/todos/164-decouple-web-ui-sprite-grid-writes.md

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

[andorthehood]

@copilot Please add this to the createMockStateWithColors, I don't want to repeat this in every single test.

[Copilot]

Done in 7cce872. Moved the sprite data generation and state updates into createMockStateWithColors to eliminate the repetition across all test files.

[Copilot]

Pull request overview

This PR refactors sprite generation to enforce proper architectural boundaries by moving state mutation responsibilities from the web-ui package (rendering layer) to the editor package (orchestration layer). The web-ui now accepts pre-generated sprite data as a parameter and returns new sprite data without mutating state directly.

Key Changes

• Web-ui's init() and reloadSpriteSheet() now use dependency injection pattern for sprite data instead of internally generating and mutating state
• Editor package now owns sprite generation and state updates for sprite-related fields (spriteLookups, hGrid, vGrid)
• All screenshot tests updated to generate sprite data before web-ui initialization

Reviewed changes

Copilot reviewed 9 out of 9 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
packages/editor/src/spriteSheetManager.ts	Updated to capture reloadSpriteSheet() return value and update state with new sprite data
packages/editor/src/index.ts	Generates sprite data before web-ui initialization and updates state accordingly
packages/editor/packages/web-ui/src/index.ts	Removed state writes; init() accepts spriteData parameter, reloadSpriteSheet() returns SpriteData
packages/editor/packages/web-ui/screenshot-tests/utils/createMockSpriteData.ts	New helper utility to generate mock sprite data for tests
packages/editor/packages/web-ui/screenshot-tests/*.test.ts	Updated four test files to generate sprite data and update state before initialization
packages/editor/packages/web-ui/README.md	Added comprehensive API documentation explaining the new initialization pattern and state usage

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

The state update logic here is duplicated in three places:

1. packages/editor/src/index.ts (lines 70-72)
2. packages/editor/src/spriteSheetManager.ts (lines 26-28)
3. All test files (lines 18-20 in each)

Consider extracting this logic into a shared helper function to reduce duplication and ensure consistency. For example:

function updateStateWithSpriteData(state: State, spriteData: SpriteData): void {
  state.graphicHelper.spriteLookups = spriteData.spriteLookups;
  state.graphicHelper.viewport.hGrid = spriteData.characterHeight;
  state.graphicHelper.viewport.vGrid = spriteData.characterWidth;
}

This would make the code more maintainable and reduce the risk of inconsistencies if this logic needs to change.

[andorthehood]

@copilot apply changes based on this feedback

[Copilot]

Applied in ea6d1d2. Created updateStateWithSpriteData helper function to eliminate the duplication across editor initialization, spriteSheetManager, and test utilities.