Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Components: Update dependencies shared with G2 components #28280

Merged
merged 6 commits into from
Jan 21, 2021

Conversation

gziolo
Copy link
Member

@gziolo gziolo commented Jan 18, 2021

Description

Related: ItsJonQ/g2#233.

This PR tries to update dependencies shared with G2 components to their latest versions.

{
	"@emotion/core": "10.1.1",
	"downshift": "6.0.15",
	"react-resize-aware": "3.1.0",
	"react-use-gesture": "9.0.0",
	"rtlcss": "2.6.2",
	"tinycolor2": "1.4.2",
}

The idea is that we use the same versions in @wp-g2/* packages so we don't use 2 copies of the same packages in Gutenberg.

How has this been tested?

I'm waiting for CI to verify if there are any breaking changes. I hope there none :)

Types of changes

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • My code has proper inline documentation.
  • I've included developer documentation if appropriate.
  • I've updated all React Native files affected by any refactorings/renamings in this PR.

@gziolo gziolo added [Package] Components /packages/components [Feature] Component System WordPress component system labels Jan 18, 2021
@gziolo gziolo requested a review from ItsJonQ January 18, 2021 12:07
@gziolo gziolo self-assigned this Jan 18, 2021
@gziolo gziolo requested a review from sarayourfriend January 18, 2021 12:08
@gziolo
Copy link
Member Author

gziolo commented Jan 18, 2021

It looks liek @emotion/core has quite fundamental changes, I will downgrade to the previous version.

@gziolo
Copy link
Member Author

gziolo commented Jan 18, 2021

rtlcss v3 has too many breaking changes, it requires PostCSS 8. Downgrading to the previous major version.

@github-actions
Copy link

github-actions bot commented Jan 18, 2021

Size Change: -17 kB (-1%)

Total Size: 1.39 MB

Filename Size Change
build/annotations/index.js 3.77 kB +1 B (0%)
build/api-fetch/index.js 3.4 kB +1 B (0%)
build/autop/index.js 2.84 kB +13 B (0%)
build/block-directory/index.js 9.08 kB +5 B (0%)
build/block-editor/index.js 122 kB -9 B (0%)
build/block-library/index.js 143 kB +105 B (0%)
build/block-serialization-default-parser/index.js 1.88 kB -1 B (0%)
build/blocks/index.js 48.3 kB +64 B (0%)
build/components/index.js 274 kB -17.4 kB (-6%)
build/compose/index.js 11.2 kB +3 B (0%)
build/core-data/index.js 15.2 kB +57 B (0%)
build/data-controls/index.js 830 B +3 B (0%)
build/data/index.js 8.97 kB -1 B (0%)
build/dom/index.js 4.93 kB -5 B (0%)
build/edit-navigation/index.js 11.1 kB +14 B (0%)
build/edit-post/index.js 306 kB +41 B (0%)
build/edit-site/index.js 24 kB +36 B (0%)
build/edit-widgets/index.js 23.6 kB +36 B (0%)
build/editor/index.js 41.8 kB +34 B (0%)
build/element/index.js 4.62 kB +9 B (0%)
build/format-library/index.js 6.77 kB +19 B (0%)
build/hooks/index.js 2.27 kB -2 B (0%)
build/html-entities/index.js 623 B +1 B (0%)
build/keyboard-shortcuts/index.js 2.53 kB +2 B (0%)
build/keycodes/index.js 1.93 kB -5 B (0%)
build/list-reusable-blocks/index.js 3.14 kB -1 B (0%)
build/media-utils/index.js 5.32 kB +11 B (0%)
build/notices/index.js 1.85 kB -4 B (0%)
build/nux/index.js 3.41 kB +4 B (0%)
build/plugins/index.js 2.54 kB -3 B (0%)
build/priority-queue/index.js 789 B -2 B (0%)
build/redux-routine/index.js 2.84 kB +5 B (0%)
build/reusable-blocks/index.js 2.92 kB +1 B (0%)
build/rich-text/index.js 13.4 kB +49 B (0%)
build/server-side-render/index.js 2.76 kB -7 B (0%)
build/shortcode/index.js 1.7 kB -1 B (0%)
build/url/index.js 3.02 kB -2 B (0%)
build/viewport/index.js 1.86 kB -2 B (0%)
build/wordcount/index.js 1.22 kB -1 B (0%)
ℹ️ View Unchanged
Filename Size Change
build/a11y/index.js 1.14 kB 0 B
build/blob/index.js 665 B 0 B
build/block-directory/style-rtl.css 1.01 kB 0 B
build/block-directory/style.css 1.01 kB 0 B
build/block-editor/style-rtl.css 11.9 kB 0 B
build/block-editor/style.css 11.9 kB 0 B
build/block-library/blocks/archives/editor-rtl.css 196 B 0 B
build/block-library/blocks/archives/editor.css 196 B 0 B
build/block-library/blocks/audio/editor-rtl.css 194 B 0 B
build/block-library/blocks/audio/editor.css 194 B 0 B
build/block-library/blocks/audio/style-rtl.css 225 B 0 B
build/block-library/blocks/audio/style.css 225 B 0 B
build/block-library/blocks/block/editor-rtl.css 283 B 0 B
build/block-library/blocks/block/editor.css 283 B 0 B
build/block-library/blocks/button/editor-rtl.css 576 B 0 B
build/block-library/blocks/button/editor.css 577 B 0 B
build/block-library/blocks/button/style-rtl.css 552 B 0 B
build/block-library/blocks/button/style.css 552 B 0 B
build/block-library/blocks/buttons/editor-rtl.css 345 B 0 B
build/block-library/blocks/buttons/editor.css 346 B 0 B
build/block-library/blocks/buttons/style-rtl.css 419 B 0 B
build/block-library/blocks/buttons/style.css 419 B 0 B
build/block-library/blocks/calendar/style-rtl.css 319 B 0 B
build/block-library/blocks/calendar/style.css 319 B 0 B
build/block-library/blocks/categories/editor-rtl.css 210 B 0 B
build/block-library/blocks/categories/editor.css 209 B 0 B
build/block-library/blocks/categories/style-rtl.css 208 B 0 B
build/block-library/blocks/categories/style.css 208 B 0 B
build/block-library/blocks/code/style-rtl.css 216 B 0 B
build/block-library/blocks/code/style.css 216 B 0 B
build/block-library/blocks/columns/editor-rtl.css 300 B 0 B
build/block-library/blocks/columns/editor.css 299 B 0 B
build/block-library/blocks/columns/style-rtl.css 529 B 0 B
build/block-library/blocks/columns/style.css 528 B 0 B
build/block-library/blocks/cover/editor-rtl.css 524 B 0 B
build/block-library/blocks/cover/editor.css 522 B 0 B
build/block-library/blocks/cover/style-rtl.css 1.3 kB 0 B
build/block-library/blocks/cover/style.css 1.3 kB 0 B
build/block-library/blocks/embed/editor-rtl.css 594 B 0 B
build/block-library/blocks/embed/editor.css 595 B 0 B
build/block-library/blocks/embed/style-rtl.css 489 B 0 B
build/block-library/blocks/embed/style.css 489 B 0 B
build/block-library/blocks/file/editor-rtl.css 314 B 0 B
build/block-library/blocks/file/editor.css 313 B 0 B
build/block-library/blocks/file/style-rtl.css 352 B 0 B
build/block-library/blocks/file/style.css 352 B 0 B
build/block-library/blocks/freeform/editor-rtl.css 2.55 kB 0 B
build/block-library/blocks/freeform/editor.css 2.55 kB 0 B
build/block-library/blocks/gallery/editor-rtl.css 783 B 0 B
build/block-library/blocks/gallery/editor.css 783 B 0 B
build/block-library/blocks/gallery/style-rtl.css 1.17 kB 0 B
build/block-library/blocks/gallery/style.css 1.17 kB 0 B
build/block-library/blocks/group/editor-rtl.css 433 B 0 B
build/block-library/blocks/group/editor.css 432 B 0 B
build/block-library/blocks/group/style-rtl.css 190 B 0 B
build/block-library/blocks/group/style.css 190 B 0 B
build/block-library/blocks/heading/editor-rtl.css 248 B 0 B
build/block-library/blocks/heading/editor.css 248 B 0 B
build/block-library/blocks/heading/style-rtl.css 212 B 0 B
build/block-library/blocks/heading/style.css 212 B 0 B
build/block-library/blocks/html/editor-rtl.css 384 B 0 B
build/block-library/blocks/html/editor.css 385 B 0 B
build/block-library/blocks/image/editor-rtl.css 801 B 0 B
build/block-library/blocks/image/editor.css 800 B 0 B
build/block-library/blocks/image/style-rtl.css 569 B 0 B
build/block-library/blocks/image/style.css 570 B 0 B
build/block-library/blocks/latest-comments/editor-rtl.css 277 B 0 B
build/block-library/blocks/latest-comments/editor.css 275 B 0 B
build/block-library/blocks/latest-comments/style-rtl.css 382 B 0 B
build/block-library/blocks/latest-comments/style.css 382 B 0 B
build/block-library/blocks/latest-posts/editor-rtl.css 254 B 0 B
build/block-library/blocks/latest-posts/editor.css 254 B 0 B
build/block-library/blocks/latest-posts/style-rtl.css 634 B 0 B
build/block-library/blocks/latest-posts/style.css 634 B 0 B
build/block-library/blocks/list/editor-rtl.css 203 B 0 B
build/block-library/blocks/list/editor.css 203 B 0 B
build/block-library/blocks/list/style-rtl.css 201 B 0 B
build/block-library/blocks/list/style.css 201 B 0 B
build/block-library/blocks/media-text/editor-rtl.css 311 B 0 B
build/block-library/blocks/media-text/editor.css 311 B 0 B
build/block-library/blocks/media-text/style-rtl.css 642 B 0 B
build/block-library/blocks/media-text/style.css 640 B 0 B
build/block-library/blocks/more/editor-rtl.css 545 B 0 B
build/block-library/blocks/more/editor.css 545 B 0 B
build/block-library/blocks/navigation-link/editor-rtl.css 503 B 0 B
build/block-library/blocks/navigation-link/editor.css 504 B 0 B
build/block-library/blocks/navigation-link/style-rtl.css 805 B 0 B
build/block-library/blocks/navigation-link/style.css 803 B 0 B
build/block-library/blocks/navigation/editor-rtl.css 1.49 kB 0 B
build/block-library/blocks/navigation/editor.css 1.48 kB 0 B
build/block-library/blocks/navigation/style-rtl.css 289 B 0 B
build/block-library/blocks/navigation/style.css 289 B 0 B
build/block-library/blocks/nextpage/editor-rtl.css 507 B 0 B
build/block-library/blocks/nextpage/editor.css 507 B 0 B
build/block-library/blocks/paragraph/editor-rtl.css 236 B 0 B
build/block-library/blocks/paragraph/editor.css 236 B 0 B
build/block-library/blocks/paragraph/style-rtl.css 392 B 0 B
build/block-library/blocks/paragraph/style.css 392 B 0 B
build/block-library/blocks/post-author/editor-rtl.css 329 B 0 B
build/block-library/blocks/post-author/editor.css 329 B 0 B
build/block-library/blocks/post-author/style-rtl.css 303 B 0 B
build/block-library/blocks/post-author/style.css 303 B 0 B
build/block-library/blocks/post-comments-form/style-rtl.css 358 B 0 B
build/block-library/blocks/post-comments-form/style.css 358 B 0 B
build/block-library/blocks/post-content/editor-rtl.css 262 B 0 B
build/block-library/blocks/post-content/editor.css 262 B 0 B
build/block-library/blocks/post-excerpt/editor-rtl.css 206 B 0 B
build/block-library/blocks/post-excerpt/editor.css 206 B 0 B
build/block-library/blocks/post-featured-image/editor-rtl.css 453 B 0 B
build/block-library/blocks/post-featured-image/editor.css 453 B 0 B
build/block-library/blocks/post-featured-image/style-rtl.css 223 B 0 B
build/block-library/blocks/post-featured-image/style.css 223 B 0 B
build/block-library/blocks/preformatted/style-rtl.css 193 B 0 B
build/block-library/blocks/preformatted/style.css 193 B 0 B
build/block-library/blocks/pullquote/editor-rtl.css 304 B 0 B
build/block-library/blocks/pullquote/editor.css 304 B 0 B
build/block-library/blocks/pullquote/style-rtl.css 428 B 0 B
build/block-library/blocks/pullquote/style.css 428 B 0 B
build/block-library/blocks/query-loop/editor-rtl.css 217 B 0 B
build/block-library/blocks/query-loop/editor.css 216 B 0 B
build/block-library/blocks/query-loop/style-rtl.css 427 B 0 B
build/block-library/blocks/query-loop/style.css 429 B 0 B
build/block-library/blocks/query-pagination-numbers/editor-rtl.css 243 B 0 B
build/block-library/blocks/query-pagination-numbers/editor.css 240 B 0 B
build/block-library/blocks/query-pagination/editor-rtl.css 390 B 0 B
build/block-library/blocks/query-pagination/editor.css 379 B 0 B
build/block-library/blocks/query-pagination/style-rtl.css 288 B 0 B
build/block-library/blocks/query-pagination/style.css 288 B 0 B
build/block-library/blocks/query/editor-rtl.css 279 B 0 B
build/block-library/blocks/query/editor.css 279 B 0 B
build/block-library/blocks/quote/editor-rtl.css 195 B 0 B
build/block-library/blocks/quote/editor.css 195 B 0 B
build/block-library/blocks/quote/style-rtl.css 284 B 0 B
build/block-library/blocks/quote/style.css 285 B 0 B
build/block-library/blocks/rss/editor-rtl.css 307 B 0 B
build/block-library/blocks/rss/editor.css 309 B 0 B
build/block-library/blocks/rss/style-rtl.css 394 B 0 B
build/block-library/blocks/rss/style.css 393 B 0 B
build/block-library/blocks/search/editor-rtl.css 285 B 0 B
build/block-library/blocks/search/editor.css 285 B 0 B
build/block-library/blocks/search/style-rtl.css 454 B 0 B
build/block-library/blocks/search/style.css 456 B 0 B
build/block-library/blocks/separator/editor-rtl.css 229 B 0 B
build/block-library/blocks/separator/editor.css 229 B 0 B
build/block-library/blocks/separator/style-rtl.css 352 B 0 B
build/block-library/blocks/separator/style.css 352 B 0 B
build/block-library/blocks/shortcode/editor-rtl.css 603 B 0 B
build/block-library/blocks/shortcode/editor.css 603 B 0 B
build/block-library/blocks/site-logo/editor-rtl.css 321 B 0 B
build/block-library/blocks/site-logo/editor.css 321 B 0 B
build/block-library/blocks/site-logo/style-rtl.css 238 B 0 B
build/block-library/blocks/site-logo/style.css 238 B 0 B
build/block-library/blocks/social-link/editor-rtl.css 283 B 0 B
build/block-library/blocks/social-link/editor.css 283 B 0 B
build/block-library/blocks/social-links/editor-rtl.css 811 B 0 B
build/block-library/blocks/social-links/editor.css 810 B 0 B
build/block-library/blocks/social-links/style-rtl.css 1.48 kB 0 B
build/block-library/blocks/social-links/style.css 1.48 kB 0 B
build/block-library/blocks/spacer/editor-rtl.css 416 B 0 B
build/block-library/blocks/spacer/editor.css 416 B 0 B
build/block-library/blocks/spacer/style-rtl.css 184 B 0 B
build/block-library/blocks/spacer/style.css 184 B 0 B
build/block-library/blocks/subhead/editor-rtl.css 223 B 0 B
build/block-library/blocks/subhead/editor.css 223 B 0 B
build/block-library/blocks/subhead/style-rtl.css 210 B 0 B
build/block-library/blocks/subhead/style.css 210 B 0 B
build/block-library/blocks/table/editor-rtl.css 593 B 0 B
build/block-library/blocks/table/editor.css 593 B 0 B
build/block-library/blocks/table/style-rtl.css 501 B 0 B
build/block-library/blocks/table/style.css 501 B 0 B
build/block-library/blocks/tag-cloud/editor-rtl.css 237 B 0 B
build/block-library/blocks/tag-cloud/editor.css 235 B 0 B
build/block-library/blocks/tag-cloud/style-rtl.css 221 B 0 B
build/block-library/blocks/tag-cloud/style.css 221 B 0 B
build/block-library/blocks/template-part/editor-rtl.css 794 B 0 B
build/block-library/blocks/template-part/editor.css 794 B 0 B
build/block-library/blocks/text-columns/editor-rtl.css 220 B 0 B
build/block-library/blocks/text-columns/editor.css 220 B 0 B
build/block-library/blocks/text-columns/style-rtl.css 283 B 0 B
build/block-library/blocks/text-columns/style.css 283 B 0 B
build/block-library/blocks/verse/editor-rtl.css 194 B 0 B
build/block-library/blocks/verse/editor.css 194 B 0 B
build/block-library/blocks/verse/style-rtl.css 215 B 0 B
build/block-library/blocks/verse/style.css 215 B 0 B
build/block-library/blocks/video/editor-rtl.css 617 B 0 B
build/block-library/blocks/video/editor.css 617 B 0 B
build/block-library/blocks/video/style-rtl.css 303 B 0 B
build/block-library/blocks/video/style.css 304 B 0 B
build/block-library/common-rtl.css 1.01 kB 0 B
build/block-library/common.css 1.01 kB 0 B
build/block-library/editor-rtl.css 9.2 kB 0 B
build/block-library/editor.css 9.18 kB 0 B
build/block-library/style-rtl.css 8.64 kB 0 B
build/block-library/style.css 8.65 kB 0 B
build/block-library/theme-rtl.css 860 B 0 B
build/block-library/theme.css 860 B 0 B
build/block-serialization-spec-parser/index.js 3.06 kB 0 B
build/components/style-rtl.css 15.5 kB 0 B
build/components/style.css 15.5 kB 0 B
build/date/index.js 31.8 kB 0 B
build/deprecated/index.js 769 B 0 B
build/dom-ready/index.js 571 B 0 B
build/edit-navigation/style-rtl.css 938 B 0 B
build/edit-navigation/style.css 944 B 0 B
build/edit-post/style-rtl.css 6.51 kB 0 B
build/edit-post/style.css 6.5 kB 0 B
build/edit-site/style-rtl.css 4.01 kB 0 B
build/edit-site/style.css 4.01 kB 0 B
build/edit-widgets/style-rtl.css 3.17 kB 0 B
build/edit-widgets/style.css 3.18 kB 0 B
build/editor/editor-styles-rtl.css 543 B 0 B
build/editor/editor-styles.css 545 B 0 B
build/editor/style-rtl.css 3.89 kB 0 B
build/editor/style.css 3.89 kB 0 B
build/escape-html/index.js 735 B 0 B
build/format-library/style-rtl.css 637 B 0 B
build/format-library/style.css 639 B 0 B
build/i18n/index.js 3.56 kB 0 B
build/is-shallow-equal/index.js 699 B 0 B
build/list-reusable-blocks/style-rtl.css 629 B 0 B
build/list-reusable-blocks/style.css 628 B 0 B
build/nux/style-rtl.css 731 B 0 B
build/nux/style.css 727 B 0 B
build/primitives/index.js 1.42 kB 0 B
build/token-list/index.js 1.27 kB 0 B
build/warning/index.js 1.14 kB 0 B

compressed-size-action

@gziolo
Copy link
Member Author

gziolo commented Jan 18, 2021

I still some unit tests failing:

  ● PanelBody › toggling › should toggle when clicking header
9155

9156
    TypeError: Cannot add property current, object is not extensible
9157

9158
      115 | 
9159
      116 | 		it( 'should toggle when clicking header', () => {
9160
    > 117 | 			const { container } = render(
9161
          | 			                      ^
9162
      118 | 				<PanelBody title="Panel" initialOpen={ false }>
9163
      119 | 					<div>Content</div>
9164
      120 | 				</PanelBody>
9165

9166
      at forEach (node_modules/react-merge-refs/src/index.tsx:11:10)
9167
          at Array.forEach (<anonymous>)
9168
      at node_modules/react-merge-refs/src/index.tsx:7:10
9169
      at HTMLUnknownElement.callCallback (node_modules/react-dom/cjs/react-dom.development.js:188:14)

It looks like an issue with react-merge-refs or tests need to be updated.

@ItsJonQ
Copy link

ItsJonQ commented Jan 18, 2021

@gziolo Haii! Just a heads up, I merged in your G2 Component dependency update and made a release:
https://github.com/ItsJonQ/g2/releases/tag/v0.0.136

@gziolo gziolo changed the title Components: Update dependncies shared with G2 components Components: Update dependencies shared with G2 components Jan 18, 2021
@gziolo gziolo force-pushed the update/upgrade-dependencies-g2-components branch from 7df9ec3 to 9cfdbb1 Compare January 19, 2021 07:07
@gziolo gziolo marked this pull request as ready for review January 19, 2021 07:07
@gziolo
Copy link
Member Author

gziolo commented Jan 19, 2021

I also downgraded react-merge-refs as it was failing with unit tests for <PanelBody /> component. I couldn't figure out while it suddenly started to throw errors. I found out also that @ellatrix is working on a useMergeRefs hook (#27768) that is eventually going to replace this tiny library so it doesn't make sense to waste time on debugging.

@gziolo gziolo mentioned this pull request Jan 19, 2021
6 tasks
@gziolo
Copy link
Member Author

gziolo commented Jan 19, 2021

@ItsJonQ, I'm afraid that drag gestures no longer work on InputField.

It works differently at:
https://wordpress.github.io/gutenberg/?path=/story/components-numbercontrol--default

and in the local instance. They had two major version bumps:

Let me know if you have an idea how to fix it. Otherwise, this PR is good to go.

@ItsJonQ
Copy link

ItsJonQ commented Jan 20, 2021

@gziolo Thanks for the heads up!

I'll take a look at the drag gestures.

@ItsJonQ
Copy link

ItsJonQ commented Jan 20, 2021

@gziolo I just made an update for the drag gestures 🤞

@gziolo gziolo force-pushed the update/upgrade-dependencies-g2-components branch from 70558fa to bf9f9e5 Compare January 21, 2021 09:55
@gziolo gziolo merged commit aaeae66 into master Jan 21, 2021
@gziolo gziolo deleted the update/upgrade-dependencies-g2-components branch January 21, 2021 12:31
@github-actions github-actions bot added this to the Gutenberg 9.9 milestone Jan 21, 2021
@gziolo
Copy link
Member Author

gziolo commented Jan 21, 2021

This PR removed 17kB from the bundle size

Screen Shot 2021-01-21 at 13 31 57

It looks like we are using two copies of Reakit. I opened ItsJonQ/g2#237 to address it on the @wp-g2 side first.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Component System WordPress component system [Package] Components /packages/components
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants