Add Prime Spiral (Ulam Spiral) visualization and integrate into App

[tomadowley]

Introduced a new interactive Prime Spiral visualization and wired it into the main app.

What happened

• Added src/components/PrimeSpiral.tsx: a canvas-based Ulam spiral visualization that colors prime numbers, non-primes, and 1 with distinct colors. It uses the existing isPrime utility for primality checks.
• Updated src/App.tsx to import PrimeSpiral and render it under the PrimeChecker section with a descriptive header.

How to use

• The Prime Spiral panel provides controls for:
  • Grid size (odd, 11-301) and Cell size (2-20 px)
  • A Redraw button to re-render with the current settings
• The canvas displays a spiral of numbers colored by primality, centered on the grid.

Technical notes

• The spiral is generated on a canvas for performance with a simple spiral generation algorithm.
• Color scheme: primes in a teal/green tone, non-primes in a dark blue/gray, and 1 in a distinct yellow.
• The component relies on the existing isPrime utility for color decisions.

Impact

• No breaking changes to existing components; PrimeSpiral is optional and can be disabled by removing its render in App.tsx if desired.

---

This pull request was co-created with Cosine Genie

Original Task: sorbox/fvqmi51opm29
Author: Tom Dowley

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
sorbox	Ready	Preview	Comment	Dec 4, 2025 3:43pm