Improve tags UI

[t-hamano]

Inspired by #495

This PR replaces the tag's input UI from a text field to a FormTokenField component.

76ac407043b2761675731f70ff8839bf.mp4

I believe this UI will have the following benefits:

• Tags have a background color, improving visibility
• In addition to commas, you can use the enter key to complete tag entry.
• Can prevent registration of duplicate tags

Also, this PR is intended to change only the UI, so there are no internal changes. If this PR is considered the first step in improving the UI, I think the ideal UI logic is as follows:

• Show theme tag label instead of theme tag slug
• Sort the existing tag list into theme tags and custom tags and separate input fields.
• Regarding theme tags, those that are equal to the array obtained from the get_theme_feature_list() function are displayed as candidates, and tags that are not included in that array are not allowed.

Below is a mockup suggestion.

Testing Instructions

• In the trunk branch, register some tags.
• If you switch to this branch, your tags should remain fine.
• Verify that entering and saving tags work correctly in this branch.

[pbking]

A great improvement!

Could we use the opportunity to point to more details about the tags?

https://make.wordpress.org/themes/handbook/review/required/theme-tags/

I tried something like the below (so that the style would match the Plugins bit below it) but I'm not sure that's the best way to do that. :?

<ExternalLink href="https://make.wordpress.org/themes/handbook/review/required/theme-tags/" style={{fontSize:'12px', marginTop:'-20px'}}>
	{ __( 'Read more.', 'create-block-theme' ) }
</ExternalLink>

[pbking]

This is a very good, simple change. With the added link to tags info I think this is ready to bring in.

[t-hamano]

I was also just working on updating this PR. I think we need to further align the focus outline to the text.

[t-hamano]

How about this?

[pbking]

👍

Good change I like it.

🚢

[vcanales]

Looks good. @t-hamano feel free to merge when you're ready.