Element: Ensure that the package uses the up to date React types #37365
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
gziolo
added
[Package] Element
gziolo
force-pushed
the
fix/types-element-react
branch
from
5b6a803 to
8ec95e0
Compare
Closed
|
I see the following error coming from TypeScript validation: Error: packages/components/src/text/hook.js(87,13): error TS2769: No overload matches this call.
Overload 1 of 2, '(template: TemplateStringsArray, ...args: CSSInterpolation[]): SerializedStyles', gave the following error.
Argument of type '{ color: Property.Color | undefined; display: Property.Display | undefined; fontSize: string; fontWeight: import('react').CSSProperties['fontWeight']; lineHeight: string | number | undefined; letterSpacing: Property.LetterSpacing<...> | undefined; textAlign: Property.TextAlign | undefined; }' is not assignable to parameter of type 'TemplateStringsArray'.
Object literal may only specify known properties, and 'color' does not exist in type 'TemplateStringsArray'.
Overload 2 of 2, '(...args: CSSInterpolation[]): SerializedStyles', gave the following error.
Argument of type '{ color: Property.Color | undefined; display: Property.Display | undefined; fontSize: string; fontWeight: import('react').CSSProperties['fontWeight']; lineHeight: string | number | undefined; letterSpacing: Property.LetterSpacing<...> | undefined; textAlign: Property.TextAlign | undefined; }' is not assignable to parameter of type 'CSSInterpolation'.
Types of property 'fontWeight' are incompatible.
Type 'FontWeight | undefined' is not assignable to type 'FontWeight | (FontWeight | undefined)[] | ("bold" | "normal" | Globals | "bolder" | "lighter")[] | undefined'.
Type 'string & {}' is not assignable to type 'FontWeight | (FontWeight | undefined)[] | ("bold" | "normal" | Globals | "bolder" | "lighter")[] | undefined'.
Type 'string & {}' is not assignable to type '"lighter"'. |
|
It almost looks like Also cc'ing @sarayourfriend in case she experienced this same issue before |
I gave it a quick try by updating Emotion to the latest version in diff --git a/packages/components/package.json b/packages/components/package.json
index 9d754f2c21..32c5430ada 100644
--- a/packages/components/package.json
+++ b/packages/components/package.json
@@ -30,10 +30,10 @@
],
"dependencies": {
"@babel/runtime": "^7.16.0",
- "@emotion/cache": "^11.4.0",
- "@emotion/css": "^11.1.3",
- "@emotion/react": "^11.4.1",
- "@emotion/styled": "^11.3.0",
+ "@emotion/cache": "^11.7.1",
+ "@emotion/css": "^11.7.1",
+ "@emotion/react": "^11.7.1",
+ "@emotion/styled": "^11.6.0",
"@emotion/utils": "1.0.0",
"@wordpress/a11y": "file:../a11y",
"@wordpress/compose": "file:../compose",I then reinstalled dependencies (via |
|
@ciampo That sounds familiar to me. I believe during the Emotion 11 upgrade I ran into similar issues with the React types drifting. |
|
I also included changes to |
gziolo
force-pushed
the
fix/types-element-react
branch
from
63164c3 to
47feff4
Compare
|
Thank you @ciampo and @sarayourfriend for your help. It looks like it resolves the issue 🎉 |
gziolo
commented
Dec 15, 2021
|
Size Change: -226 B (0%) Total Size: 1.13 MB
ℹ️ View Unchanged
|
gziolo
force-pushed
the
fix/types-element-react
branch
from
47feff4 to
bbb957c
Compare
8 tasks
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
Related to #37264, #37324 and #36041.
I detected this issue while trying to upgrade the package lock file to the format used by npm 8.
Testing
Ensure
npm iandnpm run buildworks correctly.Types of changes
Bug fix (non-breaking change which fixes an issue).
Checklist:
*.native.jsfiles for terms that need renaming or removal).