Add skill tree tab with keystones, weapon/crafting skills UI

[derivagral]

Summary

Adds a complete Skill Tree tab to the character builder, enabling users to view auto-detected skills from save files and manually configure keystones, weapon stances, and crafting skills. Integrates skill tree stats into the derived stats calculation engine.

Key Changes

New Components

• SkillTreeTab.jsx – Main tab component displaying skill tree metadata, keystones, weapon stances, crafting skills, and crystal cards
• KeystoneChecklist.jsx – Manual checklist for main tree keystones grouped by category (proximity, mastery, affinity, utility) with stat value inputs
• WeaponSkillsSection.jsx – Collapsible weapon stance skills grouped by weapon type with level and value editing
• CraftingSkillsSection.jsx – Collapsible crafting/elven skills grouped by branch with level and value editing
• SkillRow.jsx – Reusable skill row component with toggle, badge, level display, and optional stat value input
• CardsSection.jsx – Crystal cards display (visual only, effects TBD)
• SkillTreeTab.css – Complete styling for skill tree UI (341 lines) with responsive grid layouts, collapsible sections, and badge variants

State Management

• useSkillTreeStore.js – Central React hook managing:
  • Skill tree data from parsed save files
  • Manual keystone selections
  • Per-skill overrides (enabled state, level adjustments)
  • User-entered stat values
  • Computed effective stats aggregated from all sources
  • Config overrides for derived stats (affinity damage, proximity keystones)

Integration

• useDerivedStats.js – Extended to accept skillTreeStats and skillTreeConfigOverrides parameters, merging skill tree contributions into final stat calculations
• App.jsx – Added SkillTreeTab to tab navigation and integrated useSkillTreeStore hook
• CharacterTab.jsx – Updated to pass skillTreeStore to derived stats calculations

Testing

• useSkillTreeStore.test.js – Comprehensive test suite (299 lines) covering:
  • Effective stat computation from weapon/crafting skills and keystones
  • Level overrides and enabled/disabled skill filtering
  • Stat aggregation from multiple sources
  • Paragon skill level multiplication
  • Config override generation for affinity and proximity keystones
  • Flat vs. percent stat handling

Documentation

• Updated CLAUDE.md with skill tree component structure and file locations

Implementation Details

• Auto-detection: Weapon stances and crafting skills are automatically extracted from save files and displayed read-only with XP/level info
• Manual keystones: Main tree keystones require manual checkbox selection since they can't be auto-detected from save data
• Stat aggregation: Skills contribute to derived stats only when enabled and have user-entered values; paragon skills multiply by level
• Config overrides: Affinity damage keystones sum their values for eDPS calculations; proximity keystones toggle distance-based proc flags
• Responsive design: Grid layouts adapt to mobile screens; skill rows wrap value inputs on narrow viewports

https://claude.ai/code/session_01GoRqnUjSxx3Nj71jEW2NQZ