Description

Closes #36955.

Updates template details components to use server-side definitions for the Template Areas. In addition, it will allow correctly displaying custom areas registered by themes. If the custom area isn't registered, it will fall back to the "General" area.

How has this been tested?

1. Create a new template part and add it to the template parts in theme.json.
2. Use nav in the area field.
3. Use the snippet below to register the new default template part area.
4. In the site editor, add the new template part we just defined.
5. Template details should correctly display labels for this new area (as seen on screenshot).

add_filter( 'default_wp_template_part_areas', function( $areas ) {
	$areas[] = array(
		'area'        => 'nav',
		'label'       => __( 'Navigation', 'gutenberg' ),
		'description' => '',
		'icon'        => 'layout',
		'area_tag'    => 'div',
	);

	return $areas;
} );

For testing, you can also use the Wowmall theme.

Screenshots

Types of changes

Bugfix

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• I've tested my changes with keyboard and screen readers.
• 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 (please manually search all *.native.js files for terms that need renaming or removal).