Reusable React component design tip: Mimic native HTML APIs


Reusable React component design tip: Mimic native HTML APIs.

Example:
Avoid <Button label="Send" />
Prefer <Button>Send</Button>

#react
Admittedly, there's a tradeoff at play here.

✅ Accepting children is more flexible & natural.
❌ Children mean less enforcement over how it's used.

But in my experience, replacing children with separate props is typically insufficiently flexible, and leads to clunky APIs.

View original on X