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

Enable Block Renaming support for (almost) all blocks #54426

Merged
merged 16 commits into from
Oct 10, 2023

Conversation

getdave
Copy link
Contributor

@getdave getdave commented Sep 13, 2023

What?

Following on from #53735, this PR enables the ability to rename all blocks by default, with the exception of the following blocks:

  • core/block
  • core/template-part
  • core/pattern
  • core/navigation

Why?

Because it was suggested we should open up this feature.

How?

  • Adds metadata to all blocks by default (the __experimentalMetadata support is removed).
  • Add new __experimentalBlockRenaming block supports.
  • Set excluded blocks support to false.
  • Provides custom label definitions for those blocks that already implement one.

Testing Instructions

  • Add any block (except for the exceptions defined above).
  • Open list view
  • Click ellipsis menu and click Rename.
  • Enter a name.
  • See block uses custom name.
  • Repeat with all of the exception blocks and verify they cannot be renamed.

Testing Instructions for Keyboard

Screenshots or screencast

Screen.Capture.on.2023-09-22.at.13-56-24.mp4

@getdave getdave added the [Type] Feature New feature to highlight in changelogs. label Sep 13, 2023
@getdave getdave requested a review from ajitbohra as a code owner September 13, 2023 12:49
@getdave getdave self-assigned this Sep 13, 2023
@getdave getdave added the Needs Accessibility Feedback Need input from accessibility label Sep 13, 2023
@getdave
Copy link
Contributor Author

getdave commented Sep 13, 2023

I am unsure as to how this might impact accessibility. Specifically I notice that the paragraph block uses a custom label for the block when the context is accessibility. I do not know what that is used for and how to test for it. Some guidance here would be appreciated from those experienced with a11y (cc @jeryj).

@getdave
Copy link
Contributor Author

getdave commented Sep 13, 2023

I think we may need a new API to retrieve the block's custom name. Sprinkling attributes.metadata.name everywhere seems like it could get messy fast.

@github-actions
Copy link

github-actions bot commented Sep 13, 2023

Size Change: -37 B (0%)

Total Size: 1.65 MB

Filename Size Change
build/block-editor/index.min.js 218 kB -96 B (0%)
build/block-library/index.min.js 211 kB +59 B (0%)
ℹ️ View Unchanged
Filename Size
build/a11y/index.min.js 964 B
build/annotations/index.min.js 2.71 kB
build/api-fetch/index.min.js 2.29 kB
build/autop/index.min.js 2.11 kB
build/blob/index.min.js 461 B
build/block-directory/index.min.js 7.07 kB
build/block-directory/style-rtl.css 1.04 kB
build/block-directory/style.css 1.04 kB
build/block-editor/content-rtl.css 4.28 kB
build/block-editor/content.css 4.27 kB
build/block-editor/default-editor-styles-rtl.css 403 B
build/block-editor/default-editor-styles.css 403 B
build/block-editor/style-rtl.css 15.6 kB
build/block-editor/style.css 15.6 kB
build/block-library/blocks/archives/editor-rtl.css 61 B
build/block-library/blocks/archives/editor.css 60 B
build/block-library/blocks/archives/style-rtl.css 90 B
build/block-library/blocks/archives/style.css 90 B
build/block-library/blocks/audio/editor-rtl.css 150 B
build/block-library/blocks/audio/editor.css 150 B
build/block-library/blocks/audio/style-rtl.css 122 B
build/block-library/blocks/audio/style.css 122 B
build/block-library/blocks/audio/theme-rtl.css 138 B
build/block-library/blocks/audio/theme.css 138 B
build/block-library/blocks/avatar/editor-rtl.css 116 B
build/block-library/blocks/avatar/editor.css 116 B
build/block-library/blocks/avatar/style-rtl.css 104 B
build/block-library/blocks/avatar/style.css 104 B
build/block-library/blocks/block/editor-rtl.css 305 B
build/block-library/blocks/block/editor.css 305 B
build/block-library/blocks/button/editor-rtl.css 587 B
build/block-library/blocks/button/editor.css 587 B
build/block-library/blocks/button/style-rtl.css 633 B
build/block-library/blocks/button/style.css 632 B
build/block-library/blocks/buttons/editor-rtl.css 337 B
build/block-library/blocks/buttons/editor.css 337 B
build/block-library/blocks/buttons/style-rtl.css 332 B
build/block-library/blocks/buttons/style.css 332 B
build/block-library/blocks/calendar/style-rtl.css 239 B
build/block-library/blocks/calendar/style.css 239 B
build/block-library/blocks/categories/editor-rtl.css 113 B
build/block-library/blocks/categories/editor.css 112 B
build/block-library/blocks/categories/style-rtl.css 124 B
build/block-library/blocks/categories/style.css 124 B
build/block-library/blocks/code/editor-rtl.css 53 B
build/block-library/blocks/code/editor.css 53 B
build/block-library/blocks/code/style-rtl.css 121 B
build/block-library/blocks/code/style.css 121 B
build/block-library/blocks/code/theme-rtl.css 124 B
build/block-library/blocks/code/theme.css 124 B
build/block-library/blocks/columns/editor-rtl.css 108 B
build/block-library/blocks/columns/editor.css 108 B
build/block-library/blocks/columns/style-rtl.css 421 B
build/block-library/blocks/columns/style.css 421 B
build/block-library/blocks/comment-author-avatar/editor-rtl.css 125 B
build/block-library/blocks/comment-author-avatar/editor.css 125 B
build/block-library/blocks/comment-content/style-rtl.css 92 B
build/block-library/blocks/comment-content/style.css 92 B
build/block-library/blocks/comment-template/style-rtl.css 199 B
build/block-library/blocks/comment-template/style.css 198 B
build/block-library/blocks/comments-pagination-numbers/editor-rtl.css 123 B
build/block-library/blocks/comments-pagination-numbers/editor.css 121 B
build/block-library/blocks/comments-pagination/editor-rtl.css 222 B
build/block-library/blocks/comments-pagination/editor.css 209 B
build/block-library/blocks/comments-pagination/style-rtl.css 235 B
build/block-library/blocks/comments-pagination/style.css 231 B
build/block-library/blocks/comments-title/editor-rtl.css 75 B
build/block-library/blocks/comments-title/editor.css 75 B
build/block-library/blocks/comments/editor-rtl.css 840 B
build/block-library/blocks/comments/editor.css 839 B
build/block-library/blocks/comments/style-rtl.css 637 B
build/block-library/blocks/comments/style.css 636 B
build/block-library/blocks/cover/editor-rtl.css 647 B
build/block-library/blocks/cover/editor.css 650 B
build/block-library/blocks/cover/style-rtl.css 1.7 kB
build/block-library/blocks/cover/style.css 1.69 kB
build/block-library/blocks/details/editor-rtl.css 65 B
build/block-library/blocks/details/editor.css 65 B
build/block-library/blocks/details/style-rtl.css 98 B
build/block-library/blocks/details/style.css 98 B
build/block-library/blocks/embed/editor-rtl.css 293 B
build/block-library/blocks/embed/editor.css 293 B
build/block-library/blocks/embed/style-rtl.css 410 B
build/block-library/blocks/embed/style.css 410 B
build/block-library/blocks/embed/theme-rtl.css 138 B
build/block-library/blocks/embed/theme.css 138 B
build/block-library/blocks/file/editor-rtl.css 316 B
build/block-library/blocks/file/editor.css 316 B
build/block-library/blocks/file/style-rtl.css 311 B
build/block-library/blocks/file/style.css 312 B
build/block-library/blocks/file/view.min.js 321 B
build/block-library/blocks/footnotes/style-rtl.css 201 B
build/block-library/blocks/footnotes/style.css 199 B
build/block-library/blocks/form-input/editor-rtl.css 229 B
build/block-library/blocks/form-input/editor.css 228 B
build/block-library/blocks/form-input/style-rtl.css 343 B
build/block-library/blocks/form-input/style.css 343 B
build/block-library/blocks/form-submission-notification/editor-rtl.css 343 B
build/block-library/blocks/form-submission-notification/editor.css 342 B
build/block-library/blocks/form-submit-button/style-rtl.css 69 B
build/block-library/blocks/form-submit-button/style.css 69 B
build/block-library/blocks/form/view.min.js 452 B
build/block-library/blocks/freeform/editor-rtl.css 2.61 kB
build/block-library/blocks/freeform/editor.css 2.61 kB
build/block-library/blocks/gallery/editor-rtl.css 957 B
build/block-library/blocks/gallery/editor.css 962 B
build/block-library/blocks/gallery/style-rtl.css 1.55 kB
build/block-library/blocks/gallery/style.css 1.55 kB
build/block-library/blocks/gallery/theme-rtl.css 122 B
build/block-library/blocks/gallery/theme.css 122 B
build/block-library/blocks/group/editor-rtl.css 654 B
build/block-library/blocks/group/editor.css 654 B
build/block-library/blocks/group/style-rtl.css 57 B
build/block-library/blocks/group/style.css 57 B
build/block-library/blocks/group/theme-rtl.css 78 B
build/block-library/blocks/group/theme.css 78 B
build/block-library/blocks/heading/style-rtl.css 189 B
build/block-library/blocks/heading/style.css 189 B
build/block-library/blocks/html/editor-rtl.css 340 B
build/block-library/blocks/html/editor.css 341 B
build/block-library/blocks/image/editor-rtl.css 834 B
build/block-library/blocks/image/editor.css 833 B
build/block-library/blocks/image/style-rtl.css 1.48 kB
build/block-library/blocks/image/style.css 1.47 kB
build/block-library/blocks/image/theme-rtl.css 137 B
build/block-library/blocks/image/theme.css 137 B
build/block-library/blocks/image/view.min.js 1.93 kB
build/block-library/blocks/latest-comments/style-rtl.css 357 B
build/block-library/blocks/latest-comments/style.css 357 B
build/block-library/blocks/latest-posts/editor-rtl.css 213 B
build/block-library/blocks/latest-posts/editor.css 212 B
build/block-library/blocks/latest-posts/style-rtl.css 478 B
build/block-library/blocks/latest-posts/style.css 478 B
build/block-library/blocks/list/style-rtl.css 88 B
build/block-library/blocks/list/style.css 88 B
build/block-library/blocks/media-text/editor-rtl.css 266 B
build/block-library/blocks/media-text/editor.css 263 B
build/block-library/blocks/media-text/style-rtl.css 505 B
build/block-library/blocks/media-text/style.css 503 B
build/block-library/blocks/more/editor-rtl.css 431 B
build/block-library/blocks/more/editor.css 431 B
build/block-library/blocks/navigation-link/editor-rtl.css 671 B
build/block-library/blocks/navigation-link/editor.css 672 B
build/block-library/blocks/navigation-link/style-rtl.css 103 B
build/block-library/blocks/navigation-link/style.css 103 B
build/block-library/blocks/navigation-submenu/editor-rtl.css 299 B
build/block-library/blocks/navigation-submenu/editor.css 299 B
build/block-library/blocks/navigation/editor-rtl.css 2.26 kB
build/block-library/blocks/navigation/editor.css 2.26 kB
build/block-library/blocks/navigation/style-rtl.css 2.26 kB
build/block-library/blocks/navigation/style.css 2.25 kB
build/block-library/blocks/navigation/view.min.js 1.02 kB
build/block-library/blocks/nextpage/editor-rtl.css 395 B
build/block-library/blocks/nextpage/editor.css 395 B
build/block-library/blocks/page-list/editor-rtl.css 401 B
build/block-library/blocks/page-list/editor.css 401 B
build/block-library/blocks/page-list/style-rtl.css 175 B
build/block-library/blocks/page-list/style.css 175 B
build/block-library/blocks/paragraph/editor-rtl.css 235 B
build/block-library/blocks/paragraph/editor.css 235 B
build/block-library/blocks/paragraph/style-rtl.css 335 B
build/block-library/blocks/paragraph/style.css 335 B
build/block-library/blocks/post-author/style-rtl.css 175 B
build/block-library/blocks/post-author/style.css 176 B
build/block-library/blocks/post-comments-form/editor-rtl.css 96 B
build/block-library/blocks/post-comments-form/editor.css 96 B
build/block-library/blocks/post-comments-form/style-rtl.css 508 B
build/block-library/blocks/post-comments-form/style.css 508 B
build/block-library/blocks/post-date/style-rtl.css 61 B
build/block-library/blocks/post-date/style.css 61 B
build/block-library/blocks/post-excerpt/editor-rtl.css 71 B
build/block-library/blocks/post-excerpt/editor.css 71 B
build/block-library/blocks/post-excerpt/style-rtl.css 141 B
build/block-library/blocks/post-excerpt/style.css 141 B
build/block-library/blocks/post-featured-image/editor-rtl.css 588 B
build/block-library/blocks/post-featured-image/editor.css 586 B
build/block-library/blocks/post-featured-image/style-rtl.css 345 B
build/block-library/blocks/post-featured-image/style.css 345 B
build/block-library/blocks/post-navigation-link/style-rtl.css 215 B
build/block-library/blocks/post-navigation-link/style.css 214 B
build/block-library/blocks/post-template/editor-rtl.css 99 B
build/block-library/blocks/post-template/editor.css 98 B
build/block-library/blocks/post-template/style-rtl.css 409 B
build/block-library/blocks/post-template/style.css 408 B
build/block-library/blocks/post-terms/style-rtl.css 96 B
build/block-library/blocks/post-terms/style.css 96 B
build/block-library/blocks/post-time-to-read/style-rtl.css 69 B
build/block-library/blocks/post-time-to-read/style.css 69 B
build/block-library/blocks/post-title/style-rtl.css 100 B
build/block-library/blocks/post-title/style.css 100 B
build/block-library/blocks/preformatted/style-rtl.css 125 B
build/block-library/blocks/preformatted/style.css 125 B
build/block-library/blocks/pullquote/editor-rtl.css 135 B
build/block-library/blocks/pullquote/editor.css 135 B
build/block-library/blocks/pullquote/style-rtl.css 335 B
build/block-library/blocks/pullquote/style.css 335 B
build/block-library/blocks/pullquote/theme-rtl.css 168 B
build/block-library/blocks/pullquote/theme.css 168 B
build/block-library/blocks/query-pagination-numbers/editor-rtl.css 122 B
build/block-library/blocks/query-pagination-numbers/editor.css 121 B
build/block-library/blocks/query-pagination/editor-rtl.css 221 B
build/block-library/blocks/query-pagination/editor.css 211 B
build/block-library/blocks/query-pagination/style-rtl.css 288 B
build/block-library/blocks/query-pagination/style.css 284 B
build/block-library/blocks/query-title/style-rtl.css 63 B
build/block-library/blocks/query-title/style.css 63 B
build/block-library/blocks/query/editor-rtl.css 486 B
build/block-library/blocks/query/editor.css 486 B
build/block-library/blocks/query/style-rtl.css 375 B
build/block-library/blocks/query/style.css 372 B
build/block-library/blocks/query/view.min.js 609 B
build/block-library/blocks/quote/style-rtl.css 222 B
build/block-library/blocks/quote/style.css 222 B
build/block-library/blocks/quote/theme-rtl.css 223 B
build/block-library/blocks/quote/theme.css 226 B
build/block-library/blocks/read-more/style-rtl.css 132 B
build/block-library/blocks/read-more/style.css 132 B
build/block-library/blocks/rss/editor-rtl.css 149 B
build/block-library/blocks/rss/editor.css 149 B
build/block-library/blocks/rss/style-rtl.css 289 B
build/block-library/blocks/rss/style.css 288 B
build/block-library/blocks/search/editor-rtl.css 184 B
build/block-library/blocks/search/editor.css 184 B
build/block-library/blocks/search/style-rtl.css 613 B
build/block-library/blocks/search/style.css 613 B
build/block-library/blocks/search/theme-rtl.css 114 B
build/block-library/blocks/search/theme.css 114 B
build/block-library/blocks/search/view.min.js 471 B
build/block-library/blocks/separator/editor-rtl.css 146 B
build/block-library/blocks/separator/editor.css 146 B
build/block-library/blocks/separator/style-rtl.css 234 B
build/block-library/blocks/separator/style.css 234 B
build/block-library/blocks/separator/theme-rtl.css 194 B
build/block-library/blocks/separator/theme.css 194 B
build/block-library/blocks/shortcode/editor-rtl.css 329 B
build/block-library/blocks/shortcode/editor.css 329 B
build/block-library/blocks/site-logo/editor-rtl.css 760 B
build/block-library/blocks/site-logo/editor.css 760 B
build/block-library/blocks/site-logo/style-rtl.css 204 B
build/block-library/blocks/site-logo/style.css 204 B
build/block-library/blocks/site-tagline/editor-rtl.css 86 B
build/block-library/blocks/site-tagline/editor.css 86 B
build/block-library/blocks/site-title/editor-rtl.css 116 B
build/block-library/blocks/site-title/editor.css 116 B
build/block-library/blocks/site-title/style-rtl.css 57 B
build/block-library/blocks/site-title/style.css 57 B
build/block-library/blocks/social-link/editor-rtl.css 184 B
build/block-library/blocks/social-link/editor.css 184 B
build/block-library/blocks/social-links/editor-rtl.css 682 B
build/block-library/blocks/social-links/editor.css 681 B
build/block-library/blocks/social-links/style-rtl.css 1.45 kB
build/block-library/blocks/social-links/style.css 1.45 kB
build/block-library/blocks/spacer/editor-rtl.css 359 B
build/block-library/blocks/spacer/editor.css 359 B
build/block-library/blocks/spacer/style-rtl.css 48 B
build/block-library/blocks/spacer/style.css 48 B
build/block-library/blocks/table/editor-rtl.css 432 B
build/block-library/blocks/table/editor.css 432 B
build/block-library/blocks/table/style-rtl.css 646 B
build/block-library/blocks/table/style.css 645 B
build/block-library/blocks/table/theme-rtl.css 157 B
build/block-library/blocks/table/theme.css 157 B
build/block-library/blocks/tag-cloud/style-rtl.css 251 B
build/block-library/blocks/tag-cloud/style.css 253 B
build/block-library/blocks/template-part/editor-rtl.css 403 B
build/block-library/blocks/template-part/editor.css 403 B
build/block-library/blocks/template-part/theme-rtl.css 101 B
build/block-library/blocks/template-part/theme.css 101 B
build/block-library/blocks/term-description/style-rtl.css 111 B
build/block-library/blocks/term-description/style.css 111 B
build/block-library/blocks/text-columns/editor-rtl.css 95 B
build/block-library/blocks/text-columns/editor.css 95 B
build/block-library/blocks/text-columns/style-rtl.css 166 B
build/block-library/blocks/text-columns/style.css 166 B
build/block-library/blocks/verse/style-rtl.css 99 B
build/block-library/blocks/verse/style.css 99 B
build/block-library/blocks/video/editor-rtl.css 552 B
build/block-library/blocks/video/editor.css 555 B
build/block-library/blocks/video/style-rtl.css 191 B
build/block-library/blocks/video/style.css 191 B
build/block-library/blocks/video/theme-rtl.css 139 B
build/block-library/blocks/video/theme.css 139 B
build/block-library/classic-rtl.css 179 B
build/block-library/classic.css 179 B
build/block-library/common-rtl.css 1.11 kB
build/block-library/common.css 1.11 kB
build/block-library/editor-elements-rtl.css 75 B
build/block-library/editor-elements.css 75 B
build/block-library/editor-rtl.css 12.4 kB
build/block-library/editor.css 12.4 kB
build/block-library/elements-rtl.css 54 B
build/block-library/elements.css 54 B
build/block-library/reset-rtl.css 472 B
build/block-library/reset.css 472 B
build/block-library/style-rtl.css 14.4 kB
build/block-library/style.css 14.4 kB
build/block-library/theme-rtl.css 700 B
build/block-library/theme.css 705 B
build/block-serialization-default-parser/index.min.js 1.13 kB
build/block-serialization-spec-parser/index.min.js 2.87 kB
build/blocks/index.min.js 51.5 kB
build/commands/index.min.js 15.5 kB
build/commands/style-rtl.css 947 B
build/commands/style.css 942 B
build/components/index.min.js 249 kB
build/components/style-rtl.css 11.9 kB
build/components/style.css 11.9 kB
build/compose/index.min.js 12.7 kB
build/core-commands/index.min.js 2.72 kB
build/core-data/index.min.js 70.6 kB
build/customize-widgets/index.min.js 12 kB
build/customize-widgets/style-rtl.css 1.51 kB
build/customize-widgets/style.css 1.5 kB
build/data-controls/index.min.js 651 B
build/data/index.min.js 8.78 kB
build/date/index.min.js 17.9 kB
build/deprecated/index.min.js 462 B
build/dom-ready/index.min.js 336 B
build/dom/index.min.js 4.68 kB
build/edit-post/classic-rtl.css 571 B
build/edit-post/classic.css 571 B
build/edit-post/index.min.js 35.6 kB
build/edit-post/style-rtl.css 7.89 kB
build/edit-post/style.css 7.88 kB
build/edit-site/index.min.js 203 kB
build/edit-site/style-rtl.css 14.2 kB
build/edit-site/style.css 14.2 kB
build/edit-widgets/index.min.js 17 kB
build/edit-widgets/style-rtl.css 4.84 kB
build/edit-widgets/style.css 4.84 kB
build/editor/index.min.js 45.9 kB
build/editor/style-rtl.css 3.58 kB
build/editor/style.css 3.58 kB
build/element/index.min.js 4.87 kB
build/escape-html/index.min.js 548 B
build/format-library/index.min.js 7.79 kB
build/format-library/style-rtl.css 577 B
build/format-library/style.css 577 B
build/hooks/index.min.js 1.57 kB
build/html-entities/index.min.js 454 B
build/i18n/index.min.js 3.61 kB
build/interactivity/index.min.js 11.4 kB
build/is-shallow-equal/index.min.js 535 B
build/keyboard-shortcuts/index.min.js 1.76 kB
build/keycodes/index.min.js 1.9 kB
build/list-reusable-blocks/index.min.js 2.21 kB
build/list-reusable-blocks/style-rtl.css 865 B
build/list-reusable-blocks/style.css 865 B
build/media-utils/index.min.js 2.92 kB
build/notices/index.min.js 964 B
build/nux/index.min.js 2.01 kB
build/nux/style-rtl.css 775 B
build/nux/style.css 771 B
build/patterns/index.min.js 3.7 kB
build/patterns/style-rtl.css 518 B
build/patterns/style.css 517 B
build/plugins/index.min.js 1.81 kB
build/preferences-persistence/index.min.js 1.85 kB
build/preferences/index.min.js 1.26 kB
build/primitives/index.min.js 994 B
build/priority-queue/index.min.js 1.52 kB
build/private-apis/index.min.js 972 B
build/react-i18n/index.min.js 631 B
build/react-refresh-entry/index.min.js 9.46 kB
build/react-refresh-runtime/index.min.js 6.78 kB
build/redux-routine/index.min.js 2.71 kB
build/reusable-blocks/index.min.js 2.73 kB
build/reusable-blocks/style-rtl.css 265 B
build/reusable-blocks/style.css 265 B
build/rich-text/index.min.js 10.2 kB
build/router/index.min.js 1.79 kB
build/server-side-render/index.min.js 1.96 kB
build/shortcode/index.min.js 1.4 kB
build/style-engine/index.min.js 1.98 kB
build/token-list/index.min.js 587 B
build/url/index.min.js 3.84 kB
build/vendors/inert-polyfill.min.js 2.48 kB
build/vendors/react-dom.min.js 41.8 kB
build/vendors/react.min.js 4.02 kB
build/viewport/index.min.js 967 B
build/warning/index.min.js 259 B
build/widgets/index.min.js 7.18 kB
build/widgets/style-rtl.css 1.18 kB
build/widgets/style.css 1.18 kB
build/wordcount/index.min.js 1.03 kB

compressed-size-action

@jeryj
Copy link
Contributor

jeryj commented Sep 13, 2023

Specifically I notice that the paragraph block uses a custom label for the block when the context is accessibility. I do not know what that is used for and how to test for it.

Could you explain this part more? I'm unfamiliar with it. Could you point me in the right direction of how to look into this? Thanks, Dave!

@getdave
Copy link
Contributor Author

getdave commented Sep 14, 2023

Specifically I notice that the paragraph block uses a custom label for the block when the context is accessibility. I do not know what that is used for and how to test for it.

Could you explain this part more? I'm unfamiliar with it. Could you point me in the right direction of how to look into this? Thanks, Dave!

👍 It's here

__experimentalLabel( attributes, { context } ) {
const customName = attributes?.metadata?.name;
if ( context === 'list-view' && customName ) {
return attributes?.metadata?.name;
}
if ( context === 'accessibility' ) {
const { content } = attributes;
return ! content || content.length === 0 ? __( 'Empty' ) : content;
}
},

@draganescu
Copy link
Contributor

I love this. @WordPress/gutenberg-design which blocks should support manual labeling in the list view? All of them?

@getdave I think not having another abtractisation is actually good because this is an override that feels natural to read in code as this is coming from this other place, instead of magicSpell() -> label.

@getdave getdave added the Needs Design Needs design efforts. label Sep 15, 2023
@scruffian
Copy link
Contributor

If we're going to make this available to all blocks maybe we don't need a block support at all.

@richtabor
Copy link
Member

richtabor commented Sep 15, 2023

I mentioned this on #50135 (comment), but I did expect the placeholder text to be the heading block's auto-label (whatever the content is for the heading block) instead of maintaining the block name.

Flow:

  • Add a heading block with text of "Learn more"
  • Rename the heading block to "CTA Heading"
  • Press save, closing the modal.
  • Open rename modal for the heading.
  • Remove the "CTA Heading" value, to reveal the placeholder.
  • See "Heading" placeholder, instead of "Learn more" (which is what the heading label will be when I press save).

@richtabor
Copy link
Member

How do we get "Block Name" added after the existing fields in Advanced?

CleanShot 2023-09-15 at 15 59 16

@richtabor
Copy link
Member

If we're going to make this available to all blocks maybe we don't need a block support at all.

Is there a case for why we wouldn't make this globally available?

@getdave
Copy link
Contributor Author

getdave commented Sep 15, 2023

If we're going to make this available to all blocks maybe we don't need a block support at all.

Is there a case for why we wouldn't make this globally available?

Wrapper blocks - template parts, patterns...etc. It might be unusual if you could rename these? How would we like to handle those?

@richtabor
Copy link
Member

Wrapper blocks - template parts, patterns...etc. It might be unusual if you could rename these?

Well, you can rename custom template parts (not those provided by a theme). But perhaps we could just omit those wrapper blocks.

CleanShot 2023-09-15 at 17 20 04

@jameskoster
Copy link
Contributor

@richtabor I suppose the question is whether renaming a synced block in a local context should create an alias or update the source. Updating the source seems fine to me, probably with a Snackbar confirmation to clarify the change was global.

@draganescu
Copy link
Contributor

I think updating reusable / synced elements global names should not work from the list view. The list view is local - it would be OK in my head if reusable / synced elements would have their global label and a local label. If you want to change the global label a modal action is better IMO so it signifies the impact of the action.

The idea is to not rename Testimonials synced pattern to talking-heads when building a layout and then panic in the patterns library that you lost Testimonials b/c you didn't see the snackbar.

@jameskoster
Copy link
Contributor

If you want to change the global label a modal action is better IMO so it signifies the impact of the action.

That's part of the issue, renaming from list view invokes a modal. So in the case of synced blocks it might not be clear whether you're updating globally or adding a local alias, especially as Rename actions elsewhere are global.

I suppose the first question to answer is whether or not to allow aliases for synced blocks. Partially synced should be considered too. It might be better for that discussion to happen elsewhere to avoid holding up this PR?

@richtabor
Copy link
Member

@richtabor I suppose the question is whether renaming a synced block in a local context should create an alias or update the source.

The idea is to not rename Testimonials synced pattern to talking-heads when building a layout and then panic in the patterns library that you lost Testimonials b/c you didn't see the snackbar.

I lean towards local-only as well.

The other rename flows are modals as well, but it's clear that you're renaming a pattern/part — rather than a block name/list view. But I'm ok omitting template parts and synced patterns from rename.

This traces back to the notion of whether you're affecting every instance of it or not (like invoking a focus/isolated view).

@getdave
Copy link
Contributor Author

getdave commented Sep 19, 2023

So the consensus is make it conditionally available to all blocks save for template parts, patterns...etc?

@jameskoster
Copy link
Contributor

But I'm ok omitting template parts and synced patterns from rename

I'd lean towards omitting.

  1. It remains unclear how useful aliases are for synced blocks, especially as they generally have intuitive names to begin with.
  2. There's potential for confusion as to whether the change would be perceived as local or global.

Seems fine to look into this if a need arises, rather than introducing potential headaches ahead of time.

@getdave
Copy link
Contributor Author

getdave commented Sep 20, 2023

Ok now on to the technical question of how best to do this.

Currently support for the feature rests on the block adding support for __experimentalMetadata and then specifically for the name portion of that feature.

We could:

  • enable metadata support for all blocks.
  • make the rename support conditional on a new block support (__experimentalBlockRenaming).
  • make the block support truthy (can we do this!?) by default.
  • add __experimentalBlockRenaming: false to the block.json of all the block swe've decided (see above) we won't support.

Any prior art for such a thing?

@draganescu
Copy link
Contributor

I think @scruffian 's comment above makes sense, in that if all blocks support rename, it's not an opt in and therefore it's not required to create a new block support. So we only need to make sure all blocks work - by default - with metadata and they all have the name metadata available.

@getdave
Copy link
Contributor Author

getdave commented Sep 21, 2023

@getdave getdave requested a review from ellatrix as a code owner September 22, 2023 10:09
@youknowriad
Copy link
Contributor

Hi folks, it looks like this PR introduced a severe performance issue for the "block selection" metric. See https://www.codevitals.run/project/gutenberg

@getdave
Copy link
Contributor Author

getdave commented Oct 10, 2023

Let's roll back now and then take a look at which bit is causing that.

@getdave
Copy link
Contributor Author

getdave commented Oct 11, 2023

I have confirmed offending code is <BlockSettingsMenuControls> within packages/block-editor/src/hooks/block-rename-ui.js.

@getdave
Copy link
Contributor Author

getdave commented Oct 26, 2023

Outstanding Work

The following needs to be undertaken in the WP 6.5 cycle.


Updated - I created an Issue

@getdave
Copy link
Contributor Author

getdave commented Jan 22, 2024

@ockham Looks like all the work from this PR was backported to Core already in...

Am I right?

@getdave getdave added the Backported to WP Core Pull request that has been successfully merged into WP Core label Jan 22, 2024
@fabiankaegy fabiankaegy added the Needs Dev Note Requires a developer note for a major WordPress release cycle label Jan 22, 2024
@ockham
Copy link
Contributor

ockham commented Jan 23, 2024

@ockham Looks like all the work from this PR was backported to Core already in...

Am I right?

Yes! AFAICS, the only part that needed backporting was the metadata (global) attribute registration, which was covered by the ticket and PR you referenced 👍

It might however make sense to move the GB "polyfill" from lib/load.php to lib/compat/wordpress-6.5/, as you suggested.

@youknowriad
Copy link
Contributor

It might however make sense to move the GB "polyfill" from lib/load.php to lib/compat/wordpress-6.5/, as you suggested.

I think that's a good point and should be done for all the php code that is backported.

@getdave
Copy link
Contributor Author

getdave commented Jan 23, 2024

✅ I updated this PR with the Backported to Core label to indicate that the backport has successfully merged into WP Core. I also updated the PHP Sync Tracking Issue for WP 6.5.

@getdave
Copy link
Contributor Author

getdave commented Jan 23, 2024

PR for move to 6.5 compat dir #58126

✅ Completed

@getdave
Copy link
Contributor Author

getdave commented Feb 5, 2024

Dev note

Building on the foundation introduced in WordPress 6.4, all blocks (with some exceptions) can now be given custom names within the Editor.

The data for this continues to be stored under the name property of the block's metadata attribute (e.g. attributes.metadata.name).

All blocks (including 3rd party blocks) will be "renameable" by default, with the only exceptions being the following blocks:

  • core/block
  • core/template-part
  • core/pattern
  • core/navigation
  • core/navigation-link

To disable the ability to rename a block, set the relevant supports property to false in block.json:

// block.json
{
	"supports": {
		"renaming": false // disables ability to rename block via the Editor UI
	},
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Backported to WP Core Pull request that has been successfully merged into WP Core [Feature] Blocks Overall functionality of blocks Needs Accessibility Feedback Need input from accessibility Needs Design Needs design efforts. Needs Dev Note Requires a developer note for a major WordPress release cycle Needs Technical Feedback Needs testing from a developer perspective. [Type] Feature New feature to highlight in changelogs.
Projects
Development

Successfully merging this pull request may close these issues.