fix(react-utils/createPolymorph): allow components to set displayName - #814
Conversation
🦋 Changeset detectedLatest commit: c081ea1 The changes in this PR will be included in the next version bump. This PR includes changesets to release 1 package
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
There was a problem hiding this comment.
Pull request overview
This PR updates @noaignite/react-utils’s createPolymorph typing so polymorphic components can set a React-style displayName property, improving DX for debugging and DevTools labeling.
Changes:
- Extend
PolymorphicExoticComponent’s type to include an optionaldisplayName?: stringstatic. - Add a unit test ensuring
displayNamecan be assigned and read on a component returned bycreatePolymorph. - Add a patch changeset for
@noaignite/react-utils.
Changed packages/apps: @noaignite/react-utils
Changeset: Included (patch)
Docs impact: None apparent (type-only enhancement + test)
Recommended verification commands:
pnpm -F @noaignite/react-utils test:unitpnpm -F @noaignite/react-utils test:types
Risk level: Low
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated no comments.
| File | Description |
|---|---|
| packages/react-utils/src/createPolymorph.ts | Adds displayName?: string to the polymorphic component return type so consumers can set it without type errors. |
| packages/react-utils/src/createPolymorph.test.tsx | Adds a test verifying displayName can be assigned/read on a createPolymorph result. |
| .changeset/clear-geese-name.md | Declares a patch release note for the @noaignite/react-utils change. |
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
Dashice
left a comment
There was a problem hiding this comment.
Approved with one optional comment.
dfce5cb to
c081ea1
Compare
Codecov Report✅ All modified and coverable lines are covered by tests. @@ Coverage Diff @@
## main #814 +/- ##
==========================================
+ Coverage 70.62% 70.64% +0.02%
==========================================
Files 67 67
Lines 1062 1063 +1
Branches 268 269 +1
==========================================
+ Hits 750 751 +1
Misses 248 248
Partials 64 64
🚀 New features to boost your workflow:
|
createPolymorphreturns the original render function at runtime, so React components created by it can already havedisplayNameassigned. Its TypeScript return type only described the callable signature, however, valid assignments such asButton.displayName = 'Button'to fail type checking. This change exposes the optional property in the public type and adds regression coverage.