This is a design report – a story about the tradeoffs and challenges that we encountered while building a medium-complexity React component in TypeScript. These include state modeling (“making illegal states unrepresentable”) basic type-level programming in TypeScript DX patterns for generically typed React components DX patterns for reusable controlled components using a Redux-like action/dispatc
![Designing a Dataflow Editor With TypeScript and React | Protocol Labs Research](https://cdn-ak-scissors.b.st-hatena.com/image/square/1435fa18225c00a459e7e5d35d67ffdd79219404/height=288;version=1;width=512/https%3A%2F%2Fresearch.protocol.ai%2Fimages%2Fpl_research_card.png)