Problem 8: Type Safety Issues

Unclear prop types and combinations

The Problem: Type Safety Issues

Weak typing leads to runtime errors

Without strict typing, invalid props slip through:

// Weak typing
interface ButtonProps {
  variant?: string
  size?: string
  color?: string
}

// This compiles but is wrong!
<Button variant="invalid" size="huge" color="rainbow" />

Issues:

Invalid values accepted at compile time
Runtime errors instead of compile-time errors
Poor IDE autocomplete
Difficult to refactor
No documentation of valid values