Run Biome formatter on all files to ensure consistent code style:
- Single quotes for JS/TS
- Double quotes for JSX
- 2-space indentation
- 100 character line width
- Semicolons as needed
- ES5 trailing commas
This is the result of running: npx @biomejs/biome format . --write
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Update getColumnFromTermIndex to support both group and individual column mapping modes. This enables proper two-level highlighting where complement groups show both target column (rhsPlace) and individual term columns (termPlace).
- Add useGroupColumn parameter to getColumnFromTermIndex function
- Group highlighting uses rhsPlace (target column where net effect goes)
- Individual highlighting uses termPlace with rhsPlace fallback
- Update getTermIndicesFromColumn with same logic
- Add activeGroupTargetColumn state (unused but prepared for future)
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
Add comprehensive provenance tracking to link mathematical terms back to their source digits in addends. This enables enhanced tooltips that clearly show students which digit expansion corresponds to which part of the original problem.
Core changes:
- Add TermProvenance interface with source digit tracking (rhs, rhsDigit, rhsPlace, etc.)
- Add EquationAnchors interface for UI digit highlighting support
- Integrate provenance data through tutorial context instead of prop drilling
- Add buildEquationAnchors() for character position mapping
- Include groupId for complement operations that share source digits
This foundational system enables pedagogical tooltips to show "Add the tens digit — 2 tens (20) from addend 25" instead of generic "Direct Add — tens".
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Add useEffect to initialize first step with correct startValue on mount
- Add advanceMultiStep, previousMultiStep, resetMultiStep functions to context
- Implement isProgrammaticChange flag to prevent feedback loops during step navigation
- Auto-clear isProgrammaticChange flag after external value changes settle
- Ensures abacus displays correct startValue when navigating between tutorial steps
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
Replace prop drilling with centralized state management using React Context.
TutorialPlayer now uses TutorialProvider wrapper with custom hooks for
clean access to state, actions, and computed values while preserving
all existing functionality.
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>