Archives: Make the label above the dropdown editable

[colinduwe]

What?

Adds an editable label attribute to the Archives block that is displayed when "display as a dropdown" is selected.

Why?

#57528
Currently the dropdown's label is not editable.

How?

I initially opened #57613 in which I added the label attribute and put it in the sidebar. I didn't like that experience and felt it should be a RichText component instead. I bungled a rebase on that pull request. Rather than untangle my git mess I closed that PR and opened this one.

In the current PR the label is a RichText component. However, there are a few questions to resolve here

1. If @WordPress/gutenberg-design would prefer, I can put the label back in the sidebar.
2. Because this is a dynamic block and makes use of the ServerSideRender component I needed a way to signal to the render callback whether or not the current context was the editor. (AFAIK there is no php function to test this) This led me down an inelegant path of adding an isEdit attribute and a clone of attributes. I would welcome any suggestions about improving this.
3. I used wp_keses_post() to escape the label so you can use HTML tags in the label. Is that the best choice?
4. It's worth noting that the render callback had used wp_unique_id() which led all block instances to have the same label for and select id value in the editor. I added a uniqueId attribute and set it with useInstanceId which results in unique values for each instance in both the editor and the front end.

Testing Instructions

1. Open a post or page.
2. Insert an archives block.
3. Set to display as a dropdown and show label
4. Set a custom label.
5. Note that toggling the display as dropdown or show labels shows/hides the label correctly.
6. save post and confirm label is shown on the front end and the editor.

Testing Instructions for Keyboard

Similar to cursor, but confirm that tab controls correctly include the new RichText component to set the label. The tab control works correctly when the textControl is removed when the display as dropdown is unchecked.

Archives.Label.mov

[github-actions]

Warning: Type of PR label mismatch

To merge this PR, it requires exactly 1 label indicating the type of PR. Other labels are optional and not being checked here.

• Type-related labels to choose from: [Type] Automated Testing, [Type] Breaking Change, [Type] Bug, [Type] Build Tooling, [Type] Code Quality, [Type] Copy, [Type] Developer Documentation, [Type] Enhancement, [Type] Experimental, [Type] Feature, [Type] New API, [Type] Task, [Type] Technical Prototype, [Type] Performance, [Type] Project Management, [Type] Regression, [Type] Security, [Type] WP Core Ticket, Backport from WordPress Core.
• Labels found: [Block] Archives, First-time Contributor.

Read more about Type labels in Gutenberg. Don't worry if you don't have the required permissions to add labels; the PR reviewer should be able to help with the task.

[github-actions]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: colinduwe <colind@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[github-actions]

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @colinduwe! In case you missed it, we'd love to have you join us in our Slack community.

If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information.

[colinduwe]

@carolinan moving to a new, clean PR, apologies.