npm - @wordpress/fields - Versions diffs - 0.6.0 → 0.7.0 - Mend

@wordpress/fields 0.6.0 → 0.7.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (28) hide show

package/CHANGELOG.md +2 -0
package/LICENSE.md +1 -1
package/build/actions/permanently-delete-post.js +104 -65
package/build/actions/permanently-delete-post.js.map +1 -1
package/build/components/create-template-part-modal/index.js +40 -35
package/build/components/create-template-part-modal/index.js.map +1 -1
package/build/fields/page-title/view.js +6 -2
package/build/fields/page-title/view.js.map +1 -1
package/build-module/actions/permanently-delete-post.js +105 -66
package/build-module/actions/permanently-delete-post.js.map +1 -1
package/build-module/components/create-template-part-modal/index.js +41 -36
package/build-module/components/create-template-part-modal/index.js.map +1 -1
package/build-module/fields/page-title/view.js +6 -2
package/build-module/fields/page-title/view.js.map +1 -1
package/build-style/style-rtl.css +49 -43
package/build-style/style.css +49 -43
package/build-types/actions/permanently-delete-post.d.ts.map +1 -1
package/build-types/components/create-template-part-modal/index.d.ts.map +1 -1
package/build-types/fields/page-title/view.d.ts.map +1 -1
package/package.json +25 -25
package/src/actions/permanently-delete-post.tsx +157 -86
package/src/components/create-template-part-modal/index.tsx +61 -45
package/src/components/create-template-part-modal/style.scss +79 -54
package/src/fields/page-title/view.tsx +5 -2
package/src/style.scss +0 -1
package/tsconfig.json +1 -4
package/tsconfig.tsbuildinfo +1 -1
package/src/fields/page-title/style.scss +0 -10

package/build-module/actions/permanently-delete-post.js CHANGED Viewed

@@ -3,14 +3,19 @@
  * WordPress dependencies
  */
 import { store as coreStore } from '@wordpress/core-data';
-import { __, sprintf } from '@wordpress/i18n';
+import { __, _n, sprintf } from '@wordpress/i18n';
 import { store as noticesStore } from '@wordpress/notices';
 import { trash } from '@wordpress/icons';
+import { useState } from '@wordpress/element';
+import { useDispatch } from '@wordpress/data';
+import { Button, __experimentalText as Text, __experimentalHStack as HStack, __experimentalVStack as VStack } from '@wordpress/components';
+import { decodeEntities } from '@wordpress/html-entities';
 /**
  * Internal dependencies
  */
 import { getItemTitle, isTemplateOrTemplatePart } from './utils';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const permanentlyDeletePost = {
   id: 'permanently-delete',
   label: __('Permanently delete'),
@@ -26,77 +31,111 @@ const permanentlyDeletePost = {
     } = item;
     return status === 'trash' && permissions?.delete;
   },
-  async callback(posts, {
-    registry,
+  hideModalHeader: true,
+  RenderModal: ({
+    items,
+    closeModal,
     onActionPerformed
-  }) {
+  }) => {
+    const [isBusy, setIsBusy] = useState(false);
     const {
       createSuccessNotice,
       createErrorNotice
-    } = registry.dispatch(noticesStore);
+    } = useDispatch(noticesStore);
     const {
       deleteEntityRecord
-    } = registry.dispatch(coreStore);
-    const promiseResult = await Promise.allSettled(posts.map(post => {
-      return deleteEntityRecord('postType', post.type, post.id, {
-        force: true
-      }, {
-        throwOnError: true
-      });
-    }));
-    // If all the promises were fulfilled with success.
-    if (promiseResult.every(({
-      status
-    }) => status === 'fulfilled')) {
-      let successMessage;
-      if (promiseResult.length === 1) {
-        successMessage = sprintf(/* translators: The posts's title. */
-        __('"%s" permanently deleted.'), getItemTitle(posts[0]));
-      } else {
-        successMessage = __('The items were permanently deleted.');
-      }
-      createSuccessNotice(successMessage, {
-        type: 'snackbar',
-        id: 'permanently-delete-post-action'
-      });
-      onActionPerformed?.(posts);
-    } else {
-      // If there was at lease one failure.
-      let errorMessage;
-      // If we were trying to permanently delete a single post.
-      if (promiseResult.length === 1) {
-        const typedError = promiseResult[0];
-        if (typedError.reason?.message) {
-          errorMessage = typedError.reason.message;
-        } else {
-          errorMessage = __('An error occurred while permanently deleting the item.');
-        }
-        // If we were trying to permanently delete multiple posts
-      } else {
-        const errorMessages = new Set();
-        const failedPromises = promiseResult.filter(({
-          status
-        }) => status === 'rejected');
-        for (const failedPromise of failedPromises) {
-          const typedError = failedPromise;
-          if (typedError.reason?.message) {
-            errorMessages.add(typedError.reason.message);
-          }
-        }
-        if (errorMessages.size === 0) {
-          errorMessage = __('An error occurred while permanently deleting the items.');
-        } else if (errorMessages.size === 1) {
-          errorMessage = sprintf(/* translators: %s: an error message */
-          __('An error occurred while permanently deleting the items: %s'), [...errorMessages][0]);
-        } else {
-          errorMessage = sprintf(/* translators: %s: a list of comma separated error messages */
-          __('Some errors occurred while permanently deleting the items: %s'), [...errorMessages].join(','));
-        }
-      }
-      createErrorNotice(errorMessage, {
-        type: 'snackbar'
-      });
-    }
+    } = useDispatch(coreStore);
+    return /*#__PURE__*/_jsxs(VStack, {
+      spacing: "5",
+      children: [/*#__PURE__*/_jsx(Text, {
+        children: items.length > 1 ? sprintf(
+        // translators: %d: number of items to delete.
+        _n('Are you sure you want to permanently delete %d item?', 'Are you sure you want to permanently delete %d items?', items.length), items.length) : sprintf(
+        // translators: %s: The post's title
+        __('Are you sure you want to permanently delete "%s"?'), decodeEntities(getItemTitle(items[0])))
+      }), /*#__PURE__*/_jsxs(HStack, {
+        justify: "right",
+        children: [/*#__PURE__*/_jsx(Button, {
+          variant: "tertiary",
+          onClick: closeModal,
+          disabled: isBusy,
+          accessibleWhenDisabled: true,
+          __next40pxDefaultSize: true,
+          children: __('Cancel')
+        }), /*#__PURE__*/_jsx(Button, {
+          variant: "primary",
+          onClick: async () => {
+            setIsBusy(true);
+            const promiseResult = await Promise.allSettled(items.map(post => deleteEntityRecord('postType', post.type, post.id, {
+              force: true
+            }, {
+              throwOnError: true
+            })));
+            // If all the promises were fulfilled with success.
+            if (promiseResult.every(({
+              status
+            }) => status === 'fulfilled')) {
+              let successMessage;
+              if (promiseResult.length === 1) {
+                successMessage = sprintf(/* translators: The posts's title. */
+                __('"%s" permanently deleted.'), getItemTitle(items[0]));
+              } else {
+                successMessage = __('The items were permanently deleted.');
+              }
+              createSuccessNotice(successMessage, {
+                type: 'snackbar',
+                id: 'permanently-delete-post-action'
+              });
+              onActionPerformed?.(items);
+            } else {
+              // If there was at lease one failure.
+              let errorMessage;
+              // If we were trying to permanently delete a single post.
+              if (promiseResult.length === 1) {
+                const typedError = promiseResult[0];
+                if (typedError.reason?.message) {
+                  errorMessage = typedError.reason.message;
+                } else {
+                  errorMessage = __('An error occurred while permanently deleting the item.');
+                }
+                // If we were trying to permanently delete multiple posts
+              } else {
+                const errorMessages = new Set();
+                const failedPromises = promiseResult.filter(({
+                  status
+                }) => status === 'rejected');
+                for (const failedPromise of failedPromises) {
+                  const typedError = failedPromise;
+                  if (typedError.reason?.message) {
+                    errorMessages.add(typedError.reason.message);
+                  }
+                }
+                if (errorMessages.size === 0) {
+                  errorMessage = __('An error occurred while permanently deleting the items.');
+                } else if (errorMessages.size === 1) {
+                  errorMessage = sprintf(/* translators: %s: an error message */
+                  __('An error occurred while permanently deleting the items: %s'), [...errorMessages][0]);
+                } else {
+                  errorMessage = sprintf(/* translators: %s: a list of comma separated error messages */
+                  __('Some errors occurred while permanently deleting the items: %s'), [...errorMessages].join(','));
+                }
+              }
+              createErrorNotice(errorMessage, {
+                type: 'snackbar'
+              });
+            }
+            setIsBusy(false);
+            closeModal?.();
+          },
+          isBusy: isBusy,
+          disabled: isBusy,
+          accessibleWhenDisabled: true,
+          __next40pxDefaultSize: true,
+          children: __('Delete permanently')
+        })]
+      })]
+    });
   }
 };

package/build-module/actions/permanently-delete-post.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["store","coreStore","__","sprintf","noticesStore","trash","getItemTitle","isTemplateOrTemplatePart","permanentlyDeletePost","id","label","supportsBulk","icon","isEligible","item","type","status","permissions","delete","callback","posts","registry","onActionPerformed","createSuccessNotice","createErrorNotice","dispatch","deleteEntityRecord","promiseResult","Promise","allSettled","map","post","force","throwOnError","every","successMessage","length","errorMessage","typedError","reason","message","errorMessages","Set","failedPromises","filter","failedPromise","add","size","join"],"sources":["@wordpress/fields/src/actions/permanently-delete-post.tsx"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { store as coreStore } from '@wordpress/core-data';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { store as noticesStore } from '@wordpress/notices';\nimport type { Action } from '@wordpress/dataviews';\nimport { trash } from '@wordpress/icons';\n\n/\n Internal dependencies\n /\nimport { getItemTitle, isTemplateOrTemplatePart } from './utils';\nimport type { CoreDataError, PostWithPermissions } from '../types';\n\nconst permanentlyDeletePost: Action< PostWithPermissions > = {\n\tid: 'permanently-delete',\n\tlabel: __( 'Permanently delete' ),\n\tsupportsBulk: true,\n\ticon: trash,\n\tisEligible( item ) {\n\t\tif ( isTemplateOrTemplatePart( item ) \|\| item.type === 'wp_block' ) {\n\t\t\treturn false;\n\t\t}\n\t\tconst { status, permissions } = item;\n\t\treturn status === 'trash' && permissions?.delete;\n\t},\n\tasync callback( posts, { registry, onActionPerformed } ) {\n\t\tconst { createSuccessNotice, createErrorNotice } =\n\t\t\tregistry.dispatch( noticesStore );\n\t\tconst { deleteEntityRecord } = registry.dispatch( coreStore );\n\t\tconst promiseResult = await Promise.allSettled(\n\t\t\tposts.map( ( post ) => {\n\t\t\t\treturn deleteEntityRecord(\n\t\t\t\t\t'postType',\n\t\t\t\t\tpost.type,\n\t\t\t\t\tpost.id,\n\t\t\t\t\t{ force: true },\n\t\t\t\t\t{ throwOnError: true }\n\t\t\t\t);\n\t\t\t} )\n\t\t);\n\t\t// If all the promises were fulfilled with success.\n\t\tif ( promiseResult.every( ( { status } ) => status === 'fulfilled' ) ) {\n\t\t\tlet successMessage;\n\t\t\tif ( promiseResult.length === 1 ) {\n\t\t\t\tsuccessMessage = sprintf(\n\t\t\t\t\t/ translators: The posts's title. /\n\t\t\t\t\t__( '\"%s\" permanently deleted.' ),\n\t\t\t\t\tgetItemTitle( posts[ 0 ] )\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tsuccessMessage = __( 'The items were permanently deleted.' );\n\t\t\t}\n\t\t\tcreateSuccessNotice( successMessage, {\n\t\t\t\ttype: 'snackbar',\n\t\t\t\tid: 'permanently-delete-post-action',\n\t\t\t} );\n\t\t\tonActionPerformed?.( posts );\n\t\t} else {\n\t\t\t// If there was at lease one failure.\n\t\t\tlet errorMessage;\n\t\t\t// If we were trying to permanently delete a single post.\n\t\t\tif ( promiseResult.length === 1 ) {\n\t\t\t\tconst typedError = promiseResult[ 0 ] as {\n\t\t\t\t\treason?: CoreDataError;\n\t\t\t\t};\n\t\t\t\tif ( typedError.reason?.message ) {\n\t\t\t\t\terrorMessage = typedError.reason.message;\n\t\t\t\t} else {\n\t\t\t\t\terrorMessage = __(\n\t\t\t\t\t\t'An error occurred while permanently deleting the item.'\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\t// If we were trying to permanently delete multiple posts\n\t\t\t} else {\n\t\t\t\tconst errorMessages = new Set();\n\t\t\t\tconst failedPromises = promiseResult.filter(\n\t\t\t\t\t( { status } ) => status === 'rejected'\n\t\t\t\t);\n\t\t\t\tfor ( const failedPromise of failedPromises ) {\n\t\t\t\t\tconst typedError = failedPromise as {\n\t\t\t\t\t\treason?: CoreDataError;\n\t\t\t\t\t};\n\t\t\t\t\tif ( typedError.reason?.message ) {\n\t\t\t\t\t\terrorMessages.add( typedError.reason.message );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tif ( errorMessages.size === 0 ) {\n\t\t\t\t\terrorMessage = __(\n\t\t\t\t\t\t'An error occurred while permanently deleting the items.'\n\t\t\t\t\t);\n\t\t\t\t} else if ( errorMessages.size === 1 ) {\n\t\t\t\t\terrorMessage = sprintf(\n\t\t\t\t\t\t/ translators: %s: an error message /\n\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t'An error occurred while permanently deleting the items: %s'\n\t\t\t\t\t\t),\n\t\t\t\t\t\t[ ...errorMessages ][ 0 ]\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\terrorMessage = sprintf(\n\t\t\t\t\t\t/ translators: %s: a list of comma separated error messages /\n\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t'Some errors occurred while permanently deleting the items: %s'\n\t\t\t\t\t\t),\n\t\t\t\t\t\t[ ...errorMessages ].join( ',' )\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\t\t\tcreateErrorNotice( errorMessage, {\n\t\t\t\ttype: 'snackbar',\n\t\t\t} );\n\t\t}\n\t},\n};\n\n/\n Delete action for PostWithPermissions.\n */\nexport default permanentlyDeletePost;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["store","coreStore","__","_n","sprintf","noticesStore","trash","useState","useDispatch","Button","__experimentalText","Text","__experimentalHStack","HStack","__experimentalVStack","VStack","decodeEntities","getItemTitle","isTemplateOrTemplatePart","jsx","_jsx","jsxs","_jsxs","permanentlyDeletePost","id","label","supportsBulk","icon","isEligible","item","type","status","permissions","delete","hideModalHeader","RenderModal","items","closeModal","onActionPerformed","isBusy","setIsBusy","createSuccessNotice","createErrorNotice","deleteEntityRecord","spacing","children","length","justify","variant","onClick","disabled","accessibleWhenDisabled","__next40pxDefaultSize","promiseResult","Promise","allSettled","map","post","force","throwOnError","every","successMessage","errorMessage","typedError","reason","message","errorMessages","Set","failedPromises","filter","failedPromise","add","size","join"],"sources":["@wordpress/fields/src/actions/permanently-delete-post.tsx"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { store as coreStore } from '@wordpress/core-data';\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport { store as noticesStore } from '@wordpress/notices';\nimport type { Action } from '@wordpress/dataviews';\nimport { trash } from '@wordpress/icons';\nimport { useState } from '@wordpress/element';\nimport { useDispatch } from '@wordpress/data';\nimport {\n\tButton,\n\t__experimentalText as Text,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { decodeEntities } from '@wordpress/html-entities';\n\n/\n Internal dependencies\n /\nimport { getItemTitle, isTemplateOrTemplatePart } from './utils';\nimport type { CoreDataError, PostWithPermissions } from '../types';\n\nconst permanentlyDeletePost: Action< PostWithPermissions > = {\n\tid: 'permanently-delete',\n\tlabel: __( 'Permanently delete' ),\n\tsupportsBulk: true,\n\ticon: trash,\n\tisEligible( item ) {\n\t\tif ( isTemplateOrTemplatePart( item ) \|\| item.type === 'wp_block' ) {\n\t\t\treturn false;\n\t\t}\n\t\tconst { status, permissions } = item;\n\t\treturn status === 'trash' && permissions?.delete;\n\t},\n\thideModalHeader: true,\n\tRenderModal: ( { items, closeModal, onActionPerformed } ) => {\n\t\tconst [ isBusy, setIsBusy ] = useState( false );\n\t\tconst { createSuccessNotice, createErrorNotice } =\n\t\t\tuseDispatch( noticesStore );\n\t\tconst { deleteEntityRecord } = useDispatch( coreStore );\n\n\t\treturn (\n\t\t\t<VStack spacing=\"5\">\n\t\t\t\t<Text>\n\t\t\t\t\t{ items.length > 1\n\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t// translators: %d: number of items to delete.\n\t\t\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t\t\t'Are you sure you want to permanently delete %d item?',\n\t\t\t\t\t\t\t\t\t'Are you sure you want to permanently delete %d items?',\n\t\t\t\t\t\t\t\t\titems.length\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\titems.length\n\t\t\t\t\t\t )\n\t\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t\t// translators: %s: The post's title\n\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t'Are you sure you want to permanently delete \"%s\"?'\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\tdecodeEntities( getItemTitle( items[ 0 ] ) )\n\t\t\t\t\t\t ) }\n\t\t\t\t</Text>\n\t\t\t\t<HStack justify=\"right\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ closeModal }\n\t\t\t\t\t\tdisabled={ isBusy }\n\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\tonClick={ async () => {\n\t\t\t\t\t\t\tsetIsBusy( true );\n\t\t\t\t\t\t\tconst promiseResult = await Promise.allSettled(\n\t\t\t\t\t\t\t\titems.map( ( post ) =>\n\t\t\t\t\t\t\t\t\tdeleteEntityRecord(\n\t\t\t\t\t\t\t\t\t\t'postType',\n\t\t\t\t\t\t\t\t\t\tpost.type,\n\t\t\t\t\t\t\t\t\t\tpost.id,\n\t\t\t\t\t\t\t\t\t\t{ force: true },\n\t\t\t\t\t\t\t\t\t\t{ throwOnError: true }\n\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t// If all the promises were fulfilled with success.\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\tpromiseResult.every(\n\t\t\t\t\t\t\t\t\t( { status } ) => status === 'fulfilled'\n\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tlet successMessage;\n\t\t\t\t\t\t\t\tif ( promiseResult.length === 1 ) {\n\t\t\t\t\t\t\t\t\tsuccessMessage = sprintf(\n\t\t\t\t\t\t\t\t\t\t/ translators: The posts's title. /\n\t\t\t\t\t\t\t\t\t\t__( '\"%s\" permanently deleted.' ),\n\t\t\t\t\t\t\t\t\t\tgetItemTitle( items[ 0 ] )\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tsuccessMessage = __(\n\t\t\t\t\t\t\t\t\t\t'The items were permanently deleted.'\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tcreateSuccessNotice( successMessage, {\n\t\t\t\t\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\t\t\t\t\tid: 'permanently-delete-post-action',\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t\tonActionPerformed?.( items );\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t// If there was at lease one failure.\n\t\t\t\t\t\t\t\tlet errorMessage;\n\t\t\t\t\t\t\t\t// If we were trying to permanently delete a single post.\n\t\t\t\t\t\t\t\tif ( promiseResult.length === 1 ) {\n\t\t\t\t\t\t\t\t\tconst typedError = promiseResult[ 0 ] as {\n\t\t\t\t\t\t\t\t\t\treason?: CoreDataError;\n\t\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\t\tif ( typedError.reason?.message ) {\n\t\t\t\t\t\t\t\t\t\terrorMessage =\n\t\t\t\t\t\t\t\t\t\t\ttypedError.reason.message;\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\terrorMessage = __(\n\t\t\t\t\t\t\t\t\t\t\t'An error occurred while permanently deleting the item.'\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t// If we were trying to permanently delete multiple posts\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tconst errorMessages = new Set();\n\t\t\t\t\t\t\t\t\tconst failedPromises = promiseResult.filter(\n\t\t\t\t\t\t\t\t\t\t( { status } ) => status === 'rejected'\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tfor ( const failedPromise of failedPromises ) {\n\t\t\t\t\t\t\t\t\t\tconst typedError = failedPromise as {\n\t\t\t\t\t\t\t\t\t\t\treason?: CoreDataError;\n\t\t\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\t\t\tif ( typedError.reason?.message ) {\n\t\t\t\t\t\t\t\t\t\t\terrorMessages.add(\n\t\t\t\t\t\t\t\t\t\t\t\ttypedError.reason.message\n\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( errorMessages.size === 0 ) {\n\t\t\t\t\t\t\t\t\t\terrorMessage = __(\n\t\t\t\t\t\t\t\t\t\t\t'An error occurred while permanently deleting the items.'\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t} else if ( errorMessages.size === 1 ) {\n\t\t\t\t\t\t\t\t\t\terrorMessage = sprintf(\n\t\t\t\t\t\t\t\t\t\t\t/ translators: %s: an error message /\n\t\t\t\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t\t\t\t'An error occurred while permanently deleting the items: %s'\n\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t[ ...errorMessages ][ 0 ]\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\terrorMessage = sprintf(\n\t\t\t\t\t\t\t\t\t\t\t/ translators: %s: a list of comma separated error messages /\n\t\t\t\t\t\t\t\t\t\t\t__(\n\t\t\t\t\t\t\t\t\t\t\t\t'Some errors occurred while permanently deleting the items: %s'\n\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\t[ ...errorMessages ].join( ',' )\n\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tcreateErrorNotice( errorMessage, {\n\t\t\t\t\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tsetIsBusy( false );\n\t\t\t\t\t\t\tcloseModal?.();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tisBusy={ isBusy }\n\t\t\t\t\t\tdisabled={ isBusy }\n\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Delete permanently' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</HStack>\n\t\t\t</VStack>\n\t\t);\n\t},\n};\n\n/\n Delete action for PostWithPermissions.\n */\nexport default permanentlyDeletePost;\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/create-template-part-modal/index.js CHANGED Viewed

@@ -2,7 +2,7 @@
 /**
  * WordPress dependencies
  */
-import { Icon, BaseControl, TextControl, Flex, FlexItem, FlexBlock, Button, Modal, __experimentalRadioGroup as RadioGroup, __experimentalRadio as Radio, __experimentalHStack as HStack, __experimentalVStack as VStack } from '@wordpress/components';
+import { Icon, BaseControl, TextControl, Button, Modal, __experimentalHStack as HStack, __experimentalVStack as VStack } from '@wordpress/components';
 import { useInstanceId } from '@wordpress/compose';
 import { store as coreStore } from '@wordpress/core-data';
 import { useDispatch, useSelect } from '@wordpress/data';
@@ -18,6 +18,12 @@ import { serialize } from '@wordpress/blocks';
  */
 import { getCleanTemplatePartSlug, getUniqueTemplatePartTitle, useExistingTemplateParts } from './utils';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function getAreaRadioId(value, instanceId) {
+  return `fields-create-template-part-modal__area-option-${value}-${instanceId}`;
+}
+function getAreaRadioDescriptionId(value, instanceId) {
+  return `fields-create-template-part-modal__area-option-description-${value}-${instanceId}`;
+}
 /**
  * A React component that renders a modal for creating a template part. The modal displays a title and the contents for creating the template part.
  * This component should not live in this package, it should be moved to a dedicated package responsible for managing template.
@@ -132,45 +138,44 @@ export function CreateTemplatePartModalContents({
         value: title,
         onChange: setTitle,
         required: true
-      }), /*#__PURE__*/_jsx(BaseControl, {
-        __nextHasNoMarginBottom: true,
-        label: __('Area'),
-        id: `fields-create-template-part-modal__area-selection-${instanceId}`,
-        className: "fields-create-template-part-modal__area-base-control",
-        children: /*#__PURE__*/_jsx(RadioGroup, {
-          label: __('Area'),
+      }), /*#__PURE__*/_jsxs("fieldset", {
+        children: [/*#__PURE__*/_jsx(BaseControl.VisualLabel, {
+          as: "legend",
+          children: __('Area')
+        }), /*#__PURE__*/_jsx("div", {
           className: "fields-create-template-part-modal__area-radio-group",
-          id: `fields-create-template-part-modal__area-selection-${instanceId}`,
-          onChange: value => value && typeof value === 'string' ? setArea(value) : () => void 0,
-          checked: area,
           children: (defaultTemplatePartAreas !== null && defaultTemplatePartAreas !== void 0 ? defaultTemplatePartAreas : []).map(item => {
             const icon = getTemplatePartIcon(item.icon);
-            return /*#__PURE__*/_jsx(Radio, {
-              __next40pxDefaultSize: true,
-              value: item.area,
-              className: "fields-create-template-part-modal__area-radio",
-              children: /*#__PURE__*/_jsxs(Flex, {
-                align: "start",
-                justify: "start",
-                children: [/*#__PURE__*/_jsx(FlexItem, {
-                  children: /*#__PURE__*/_jsx(Icon, {
-                    icon: icon
-                  })
-                }), /*#__PURE__*/_jsxs(FlexBlock, {
-                  className: "fields-create-template-part-modal__option-label",
-                  children: [item.label, /*#__PURE__*/_jsx("div", {
-                    children: item.description
-                  })]
-                }), /*#__PURE__*/_jsx(FlexItem, {
-                  className: "fields-create-template-part-modal__checkbox",
-                  children: area === item.area && /*#__PURE__*/_jsx(Icon, {
-                    icon: check
-                  })
-                })]
-              })
-            }, item.label);
+            return /*#__PURE__*/_jsxs("div", {
+              className: "fields-create-template-part-modal__area-radio-wrapper",
+              children: [/*#__PURE__*/_jsx("input", {
+                type: "radio",
+                id: getAreaRadioId(item.area, instanceId),
+                name: `fields-create-template-part-modal__area-${instanceId}`,
+                value: item.area,
+                checked: area === item.area,
+                onChange: () => {
+                  setArea(item.area);
+                },
+                "aria-describedby": getAreaRadioDescriptionId(item.area, instanceId)
+              }), /*#__PURE__*/_jsx(Icon, {
+                icon: icon,
+                className: "fields-create-template-part-modal__area-radio-icon"
+              }), /*#__PURE__*/_jsx("label", {
+                htmlFor: getAreaRadioId(item.area, instanceId),
+                className: "fields-create-template-part-modal__area-radio-label",
+                children: item.label
+              }), /*#__PURE__*/_jsx(Icon, {
+                icon: check,
+                className: "fields-create-template-part-modal__area-radio-checkmark"
+              }), /*#__PURE__*/_jsx("p", {
+                className: "fields-create-template-part-modal__area-radio-description",
+                id: getAreaRadioDescriptionId(item.area, instanceId),
+                children: item.description
+              })]
+            }, item.area);
           })
-        })
+        })]
       }), /*#__PURE__*/_jsxs(HStack, {
         justify: "right",
         children: [/*#__PURE__*/_jsx(Button, {

package/build-module/components/create-template-part-modal/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["Icon","BaseControl","TextControl","Flex","FlexItem","FlexBlock","Button","Modal","__experimentalRadioGroup","RadioGroup","__experimentalRadio","Radio","__experimentalHStack","HStack","__experimentalVStack","VStack","useInstanceId","store","coreStore","useDispatch","useSelect","useState","__","check","footer","footerIcon","header","headerIcon","sidebar","sidebarIcon","symbolFilled","symbolFilledIcon","noticesStore","serialize","getCleanTemplatePartSlug","getUniqueTemplatePartTitle","useExistingTemplateParts","jsx","_jsx","jsxs","_jsxs","CreateTemplatePartModal","modalTitle","restProps","defaultModalTitle","select","getPostType","labels","add_new_item","title","onRequestClose","closeModal","overlayClassName","focusOnMount","size","children","CreateTemplatePartModalContents","getTemplatePartIcon","iconName","defaultArea","blocks","confirmLabel","onCreate","onError","defaultTitle","createErrorNotice","saveEntityRecord","existingTemplateParts","setTitle","area","setArea","isSubmitting","setIsSubmitting","instanceId","defaultTemplatePartAreas","getEntityRecord","default_template_part_areas","createTemplatePart","uniqueTitle","cleanSlug","templatePart","slug","content","throwOnError","error","errorMessage","Error","message","code","type","onSubmit","event","preventDefault","spacing","__next40pxDefaultSize","__nextHasNoMarginBottom","label","value","onChange","required","id","className","checked","map","item","icon","align","justify","description","variant","onClick","isBusy"],"sources":["@wordpress/fields/src/components/create-template-part-modal/index.tsx"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\tIcon,\n\tBaseControl,\n\tTextControl,\n\tFlex,\n\tFlexItem,\n\tFlexBlock,\n\tButton,\n\tModal,\n\t__experimentalRadioGroup as RadioGroup,\n\t__experimentalRadio as Radio,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tcheck,\n\tfooter as footerIcon,\n\theader as headerIcon,\n\tsidebar as sidebarIcon,\n\tsymbolFilled as symbolFilledIcon,\n} from '@wordpress/icons';\nimport { store as noticesStore } from '@wordpress/notices';\n// @ts-expect-error serialize is not typed\nimport { serialize } from '@wordpress/blocks';\n\n/\n Internal dependencies\n /\nimport {\n\tgetCleanTemplatePartSlug,\n\tgetUniqueTemplatePartTitle,\n\tuseExistingTemplateParts,\n} from './utils';\n\ntype CreateTemplatePartModalContentsProps = {\n\tdefaultArea?: string;\n\tblocks: any[];\n\tconfirmLabel?: string;\n\tcloseModal: () => void;\n\tonCreate: ( templatePart: any ) => void;\n\tonError?: () => void;\n\tdefaultTitle?: string;\n};\n\ntype TemplatePartArea = {\n\tarea: string;\n\tlabel: string;\n\ticon: string;\n\tdescription: string;\n};\n\n/\n A React component that renders a modal for creating a template part. The modal displays a title and the contents for creating the template part.\n * This component should not live in this package, it should be moved to a dedicated package responsible for managing template.\n * @param {Object} props The component props.\n * @param props.modalTitle\n /\nexport default function CreateTemplatePartModal( {\n\tmodalTitle,\n\t...restProps\n}: {\n\tmodalTitle: string;\n} & CreateTemplatePartModalContentsProps ) {\n\tconst defaultModalTitle = useSelect(\n\t\t( select ) =>\n\t\t\t// @ts-expect-error getPostType is not typed with 'wp_template_part' as argument.\n\t\t\tselect( coreStore ).getPostType( 'wp_template_part' )?.labels\n\t\t\t\t?.add_new_item,\n\t\t[]\n\t);\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ modalTitle \|\| defaultModalTitle }\n\t\t\tonRequestClose={ restProps.closeModal }\n\t\t\toverlayClassName=\"fields-create-template-part-modal\"\n\t\t\tfocusOnMount=\"firstContentElement\"\n\t\t\tsize=\"medium\"\n\t\t>\n\t\t\t<CreateTemplatePartModalContents { ...restProps } />\n\t\t</Modal>\n\t);\n}\n\nconst getTemplatePartIcon = ( iconName: string ) => {\n\tif ( 'header' === iconName ) {\n\t\treturn headerIcon;\n\t} else if ( 'footer' === iconName ) {\n\t\treturn footerIcon;\n\t} else if ( 'sidebar' === iconName ) {\n\t\treturn sidebarIcon;\n\t}\n\treturn symbolFilledIcon;\n};\n\n/\n A React component that renders the content of a model for creating a template part.\n * This component should not live in this package; it should be moved to a dedicated package responsible for managing template.\n \n @param {Object} props - The component props.\n * @param {string} [props.defaultArea=uncategorized] - The default area for the template part.\n * @param {Array} [props.blocks=[]] - The blocks to be included in the template part.\n * @param {string} [props.confirmLabel='Add'] - The label for the confirm button.\n * @param {Function} props.closeModal - Function to close the modal.\n * @param {Function} props.onCreate - Function to call when the template part is successfully created.\n * @param {Function} [props.onError] - Function to call when there is an error creating the template part.\n * @param {string} [props.defaultTitle=''] - The default title for the template part.\n */\nexport function CreateTemplatePartModalContents( {\n\tdefaultArea = 'uncategorized',\n\tblocks = [],\n\tconfirmLabel = __( 'Add' ),\n\tcloseModal,\n\tonCreate,\n\tonError,\n\tdefaultTitle = '',\n}: CreateTemplatePartModalContentsProps ) {\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tconst { saveEntityRecord } = useDispatch( coreStore );\n\tconst existingTemplateParts = useExistingTemplateParts();\n\n\tconst [ title, setTitle ] = useState( defaultTitle );\n\tconst [ area, setArea ] = useState( defaultArea );\n\tconst [ isSubmitting, setIsSubmitting ] = useState( false );\n\tconst instanceId = useInstanceId( CreateTemplatePartModal );\n\n\tconst defaultTemplatePartAreas = useSelect(\n\t\t( select ) =>\n\t\t\t// @ts-expect-error getEntityRecord is not typed with unstableBase as argument.\n\t\t\tselect( coreStore ).getEntityRecord< {\n\t\t\t\tdefault_template_part_areas: Array< TemplatePartArea >;\n\t\t\t} >( 'root', '__unstableBase' )?.default_template_part_areas,\n\t\t[]\n\t);\n\n\tasync function createTemplatePart() {\n\t\tif ( ! title \|\| isSubmitting ) {\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tsetIsSubmitting( true );\n\t\t\tconst uniqueTitle = getUniqueTemplatePartTitle(\n\t\t\t\ttitle,\n\t\t\t\texistingTemplateParts\n\t\t\t);\n\t\t\tconst cleanSlug = getCleanTemplatePartSlug( uniqueTitle );\n\n\t\t\tconst templatePart = await saveEntityRecord(\n\t\t\t\t'postType',\n\t\t\t\t'wp_template_part',\n\t\t\t\t{\n\t\t\t\t\tslug: cleanSlug,\n\t\t\t\t\ttitle: uniqueTitle,\n\t\t\t\t\tcontent: serialize( blocks ),\n\t\t\t\t\tarea,\n\t\t\t\t},\n\t\t\t\t{ throwOnError: true }\n\t\t\t);\n\t\t\tawait onCreate( templatePart );\n\n\t\t\t// TODO: Add a success notice?\n\t\t} catch ( error ) {\n\t\t\tconst errorMessage =\n\t\t\t\terror instanceof Error &&\n\t\t\t\t'code' in error &&\n\t\t\t\terror.message &&\n\t\t\t\terror.code !== 'unknown_error'\n\t\t\t\t\t? error.message\n\t\t\t\t\t: __(\n\t\t\t\t\t\t\t'An error occurred while creating the template part.'\n\t\t\t\t\t );\n\n\t\t\tcreateErrorNotice( errorMessage, { type: 'snackbar' } );\n\n\t\t\tonError?.();\n\t\t} finally {\n\t\t\tsetIsSubmitting( false );\n\t\t}\n\t}\n\treturn (\n\t\t<form\n\t\t\tonSubmit={ async ( event ) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tawait createTemplatePart();\n\t\t\t} }\n\t\t>\n\t\t\t<VStack spacing=\"4\">\n\t\t\t\t<TextControl\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tlabel={ __( 'Name' ) }\n\t\t\t\t\tvalue={ title }\n\t\t\t\t\tonChange={ setTitle }\n\t\t\t\t\trequired\n\t\t\t\t/>\n\t\t\t\t<BaseControl\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tlabel={ __( 'Area' ) }\n\t\t\t\t\tid={ `fields-create-template-part-modal__area-selection-${ instanceId }` }\n\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-base-control\"\n\t\t\t\t>\n\t\t\t\t\t<RadioGroup\n\t\t\t\t\t\tlabel={ __( 'Area' ) }\n\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-group\"\n\t\t\t\t\t\tid={ `fields-create-template-part-modal__area-selection-${ instanceId }` }\n\t\t\t\t\t\tonChange={ ( value ) =>\n\t\t\t\t\t\t\tvalue && typeof value === 'string'\n\t\t\t\t\t\t\t\t? setArea( value )\n\t\t\t\t\t\t\t\t: () => void 0\n\t\t\t\t\t\t}\n\t\t\t\t\t\tchecked={ area }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ( defaultTemplatePartAreas ?? [] ).map( ( item ) => {\n\t\t\t\t\t\t\tconst icon = getTemplatePartIcon( item.icon );\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<Radio\n\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\tkey={ item.label }\n\t\t\t\t\t\t\t\t\tvalue={ item.area }\n\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<Flex align=\"start\" justify=\"start\">\n\t\t\t\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t\t\t\t<Icon icon={ icon } />\n\t\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t\t<FlexBlock className=\"fields-create-template-part-modal__option-label\">\n\t\t\t\t\t\t\t\t\t\t\t{ item.label }\n\t\t\t\t\t\t\t\t\t\t\t<div>{ item.description }</div>\n\t\t\t\t\t\t\t\t\t\t</FlexBlock>\n\n\t\t\t\t\t\t\t\t\t\t<FlexItem className=\"fields-create-template-part-modal__checkbox\">\n\t\t\t\t\t\t\t\t\t\t\t{ area === item.area && (\n\t\t\t\t\t\t\t\t\t\t\t\t<Icon icon={ check } />\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t</Flex>\n\t\t\t\t\t\t\t\t</Radio>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</RadioGroup>\n\t\t\t\t</BaseControl>\n\t\t\t\t<HStack justify=\"right\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\taria-disabled={ ! title \|\| isSubmitting }\n\t\t\t\t\t\tisBusy={ isSubmitting }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ confirmLabel }\n\t\t\t\t\t</Button>\n\t\t\t\t</HStack>\n\t\t\t</VStack>\n\t\t</form>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["Icon","BaseControl","TextControl","Button","Modal","__experimentalHStack","HStack","__experimentalVStack","VStack","useInstanceId","store","coreStore","useDispatch","useSelect","useState","__","check","footer","footerIcon","header","headerIcon","sidebar","sidebarIcon","symbolFilled","symbolFilledIcon","noticesStore","serialize","getCleanTemplatePartSlug","getUniqueTemplatePartTitle","useExistingTemplateParts","jsx","_jsx","jsxs","_jsxs","getAreaRadioId","value","instanceId","getAreaRadioDescriptionId","CreateTemplatePartModal","modalTitle","restProps","defaultModalTitle","select","getPostType","labels","add_new_item","title","onRequestClose","closeModal","overlayClassName","focusOnMount","size","children","CreateTemplatePartModalContents","getTemplatePartIcon","iconName","defaultArea","blocks","confirmLabel","onCreate","onError","defaultTitle","createErrorNotice","saveEntityRecord","existingTemplateParts","setTitle","area","setArea","isSubmitting","setIsSubmitting","defaultTemplatePartAreas","getEntityRecord","default_template_part_areas","createTemplatePart","uniqueTitle","cleanSlug","templatePart","slug","content","throwOnError","error","errorMessage","Error","message","code","type","onSubmit","event","preventDefault","spacing","__next40pxDefaultSize","__nextHasNoMarginBottom","label","onChange","required","VisualLabel","as","className","map","item","icon","id","name","checked","htmlFor","description","justify","variant","onClick","isBusy"],"sources":["@wordpress/fields/src/components/create-template-part-modal/index.tsx"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\tIcon,\n\tBaseControl,\n\tTextControl,\n\tButton,\n\tModal,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useInstanceId } from '@wordpress/compose';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tcheck,\n\tfooter as footerIcon,\n\theader as headerIcon,\n\tsidebar as sidebarIcon,\n\tsymbolFilled as symbolFilledIcon,\n} from '@wordpress/icons';\nimport { store as noticesStore } from '@wordpress/notices';\n// @ts-expect-error serialize is not typed\nimport { serialize } from '@wordpress/blocks';\n\n/\n Internal dependencies\n /\nimport {\n\tgetCleanTemplatePartSlug,\n\tgetUniqueTemplatePartTitle,\n\tuseExistingTemplateParts,\n} from './utils';\n\nfunction getAreaRadioId( value: string, instanceId: number ) {\n\treturn `fields-create-template-part-modal__area-option-${ value }-${ instanceId }`;\n}\nfunction getAreaRadioDescriptionId( value: string, instanceId: number ) {\n\treturn `fields-create-template-part-modal__area-option-description-${ value }-${ instanceId }`;\n}\n\ntype CreateTemplatePartModalContentsProps = {\n\tdefaultArea?: string;\n\tblocks: any[];\n\tconfirmLabel?: string;\n\tcloseModal: () => void;\n\tonCreate: ( templatePart: any ) => void;\n\tonError?: () => void;\n\tdefaultTitle?: string;\n};\n\ntype TemplatePartArea = {\n\tarea: string;\n\tlabel: string;\n\ticon: string;\n\tdescription: string;\n};\n\n/\n A React component that renders a modal for creating a template part. The modal displays a title and the contents for creating the template part.\n * This component should not live in this package, it should be moved to a dedicated package responsible for managing template.\n * @param {Object} props The component props.\n * @param props.modalTitle\n /\nexport default function CreateTemplatePartModal( {\n\tmodalTitle,\n\t...restProps\n}: {\n\tmodalTitle: string;\n} & CreateTemplatePartModalContentsProps ) {\n\tconst defaultModalTitle = useSelect(\n\t\t( select ) =>\n\t\t\t// @ts-expect-error getPostType is not typed with 'wp_template_part' as argument.\n\t\t\tselect( coreStore ).getPostType( 'wp_template_part' )?.labels\n\t\t\t\t?.add_new_item,\n\t\t[]\n\t);\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ modalTitle \|\| defaultModalTitle }\n\t\t\tonRequestClose={ restProps.closeModal }\n\t\t\toverlayClassName=\"fields-create-template-part-modal\"\n\t\t\tfocusOnMount=\"firstContentElement\"\n\t\t\tsize=\"medium\"\n\t\t>\n\t\t\t<CreateTemplatePartModalContents { ...restProps } />\n\t\t</Modal>\n\t);\n}\n\nconst getTemplatePartIcon = ( iconName: string ) => {\n\tif ( 'header' === iconName ) {\n\t\treturn headerIcon;\n\t} else if ( 'footer' === iconName ) {\n\t\treturn footerIcon;\n\t} else if ( 'sidebar' === iconName ) {\n\t\treturn sidebarIcon;\n\t}\n\treturn symbolFilledIcon;\n};\n\n/\n A React component that renders the content of a model for creating a template part.\n * This component should not live in this package; it should be moved to a dedicated package responsible for managing template.\n \n @param {Object} props - The component props.\n * @param {string} [props.defaultArea=uncategorized] - The default area for the template part.\n * @param {Array} [props.blocks=[]] - The blocks to be included in the template part.\n * @param {string} [props.confirmLabel='Add'] - The label for the confirm button.\n * @param {Function} props.closeModal - Function to close the modal.\n * @param {Function} props.onCreate - Function to call when the template part is successfully created.\n * @param {Function} [props.onError] - Function to call when there is an error creating the template part.\n * @param {string} [props.defaultTitle=''] - The default title for the template part.\n */\nexport function CreateTemplatePartModalContents( {\n\tdefaultArea = 'uncategorized',\n\tblocks = [],\n\tconfirmLabel = __( 'Add' ),\n\tcloseModal,\n\tonCreate,\n\tonError,\n\tdefaultTitle = '',\n}: CreateTemplatePartModalContentsProps ) {\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\tconst { saveEntityRecord } = useDispatch( coreStore );\n\tconst existingTemplateParts = useExistingTemplateParts();\n\n\tconst [ title, setTitle ] = useState( defaultTitle );\n\tconst [ area, setArea ] = useState( defaultArea );\n\tconst [ isSubmitting, setIsSubmitting ] = useState( false );\n\tconst instanceId = useInstanceId( CreateTemplatePartModal );\n\n\tconst defaultTemplatePartAreas = useSelect(\n\t\t( select ) =>\n\t\t\t// @ts-expect-error getEntityRecord is not typed with unstableBase as argument.\n\t\t\tselect( coreStore ).getEntityRecord< {\n\t\t\t\tdefault_template_part_areas: Array< TemplatePartArea >;\n\t\t\t} >( 'root', '__unstableBase' )?.default_template_part_areas,\n\t\t[]\n\t);\n\n\tasync function createTemplatePart() {\n\t\tif ( ! title \|\| isSubmitting ) {\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tsetIsSubmitting( true );\n\t\t\tconst uniqueTitle = getUniqueTemplatePartTitle(\n\t\t\t\ttitle,\n\t\t\t\texistingTemplateParts\n\t\t\t);\n\t\t\tconst cleanSlug = getCleanTemplatePartSlug( uniqueTitle );\n\n\t\t\tconst templatePart = await saveEntityRecord(\n\t\t\t\t'postType',\n\t\t\t\t'wp_template_part',\n\t\t\t\t{\n\t\t\t\t\tslug: cleanSlug,\n\t\t\t\t\ttitle: uniqueTitle,\n\t\t\t\t\tcontent: serialize( blocks ),\n\t\t\t\t\tarea,\n\t\t\t\t},\n\t\t\t\t{ throwOnError: true }\n\t\t\t);\n\t\t\tawait onCreate( templatePart );\n\n\t\t\t// TODO: Add a success notice?\n\t\t} catch ( error ) {\n\t\t\tconst errorMessage =\n\t\t\t\terror instanceof Error &&\n\t\t\t\t'code' in error &&\n\t\t\t\terror.message &&\n\t\t\t\terror.code !== 'unknown_error'\n\t\t\t\t\t? error.message\n\t\t\t\t\t: __(\n\t\t\t\t\t\t\t'An error occurred while creating the template part.'\n\t\t\t\t\t );\n\n\t\t\tcreateErrorNotice( errorMessage, { type: 'snackbar' } );\n\n\t\t\tonError?.();\n\t\t} finally {\n\t\t\tsetIsSubmitting( false );\n\t\t}\n\t}\n\treturn (\n\t\t<form\n\t\t\tonSubmit={ async ( event ) => {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tawait createTemplatePart();\n\t\t\t} }\n\t\t>\n\t\t\t<VStack spacing=\"4\">\n\t\t\t\t<TextControl\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\tlabel={ __( 'Name' ) }\n\t\t\t\t\tvalue={ title }\n\t\t\t\t\tonChange={ setTitle }\n\t\t\t\t\trequired\n\t\t\t\t/>\n\t\t\t\t<fieldset>\n\t\t\t\t\t<BaseControl.VisualLabel as=\"legend\">\n\t\t\t\t\t\t{ __( 'Area' ) }\n\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t<div className=\"fields-create-template-part-modal__area-radio-group\">\n\t\t\t\t\t\t{ ( defaultTemplatePartAreas ?? [] ).map( ( item ) => {\n\t\t\t\t\t\t\tconst icon = getTemplatePartIcon( item.icon );\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tkey={ item.area }\n\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-wrapper\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\t\t\tid={ getAreaRadioId(\n\t\t\t\t\t\t\t\t\t\t\titem.area,\n\t\t\t\t\t\t\t\t\t\t\tinstanceId\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\tname={ `fields-create-template-part-modal__area-${ instanceId }` }\n\t\t\t\t\t\t\t\t\t\tvalue={ item.area }\n\t\t\t\t\t\t\t\t\t\tchecked={ area === item.area }\n\t\t\t\t\t\t\t\t\t\tonChange={ () => {\n\t\t\t\t\t\t\t\t\t\t\tsetArea( item.area );\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\taria-describedby={ getAreaRadioDescriptionId(\n\t\t\t\t\t\t\t\t\t\t\titem.area,\n\t\t\t\t\t\t\t\t\t\t\tinstanceId\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-icon\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<label\n\t\t\t\t\t\t\t\t\t\thtmlFor={ getAreaRadioId(\n\t\t\t\t\t\t\t\t\t\t\titem.area,\n\t\t\t\t\t\t\t\t\t\t\tinstanceId\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-label\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ item.label }\n\t\t\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-checkmark\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t<p\n\t\t\t\t\t\t\t\t\t\tclassName=\"fields-create-template-part-modal__area-radio-description\"\n\t\t\t\t\t\t\t\t\t\tid={ getAreaRadioDescriptionId(\n\t\t\t\t\t\t\t\t\t\t\titem.area,\n\t\t\t\t\t\t\t\t\t\t\tinstanceId\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ item.description }\n\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t</div>\n\t\t\t\t</fieldset>\n\t\t\t\t<HStack justify=\"right\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tcloseModal();\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t\t<Button\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\taria-disabled={ ! title \|\| isSubmitting }\n\t\t\t\t\t\tisBusy={ isSubmitting }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ confirmLabel }\n\t\t\t\t\t</Button>\n\t\t\t\t</HStack>\n\t\t\t</VStack>\n\t\t</form>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build-module/fields/page-title/view.js CHANGED Viewed

@@ -4,13 +4,18 @@
 import { __ } from '@wordpress/i18n';
 import { useSelect } from '@wordpress/data';
 import { store as coreStore } from '@wordpress/core-data';
+import { privateApis as componentsPrivateApis } from '@wordpress/components';
 /**
  * Internal dependencies
  */
 import { BaseTitleView } from '../title/view';
+import { unlock } from '../../lock-unlock';
 import { jsx as _jsx } from "react/jsx-runtime";
+const {
+  Badge
+} = unlock(componentsPrivateApis);
 export default function PageTitleView({
   item
 }) {
@@ -30,8 +35,7 @@ export default function PageTitleView({
   return /*#__PURE__*/_jsx(BaseTitleView, {
     item: item,
     className: "fields-field__page-title",
-    children: [frontPageId, postsPageId].includes(item.id) && /*#__PURE__*/_jsx("span", {
-      className: "fields-field__page-title__badge",
+    children: [frontPageId, postsPageId].includes(item.id) && /*#__PURE__*/_jsx(Badge, {
       children: item.id === frontPageId ? __('Homepage') : __('Posts Page')
     })
   });

package/build-module/fields/page-title/view.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__","useSelect","store","coreStore","BaseTitleView","jsx","_jsx","PageTitleView","item","frontPageId","postsPageId","select","getEntityRecord","siteSettings","page_on_front","page_for_posts","className","children","includes","id"],"sources":["@wordpress/fields/src/fields/page-title/view.tsx"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport type { Settings } from '@wordpress/core-data';\n\n/\n Internal dependencies\n */\nimport type { CommonPost } from '../../types';\nimport { BaseTitleView } from '../title/view';\n\nexport default function PageTitleView( { item }: { item: CommonPost } ) {\n\tconst { frontPageId, postsPageId } = useSelect( ( select ) => {\n\t\tconst { getEntityRecord } = select( coreStore );\n\t\tconst siteSettings = getEntityRecord(\n\t\t\t'root',\n\t\t\t'site'\n\t\t) as Partial< Settings >;\n\t\treturn {\n\t\t\tfrontPageId: siteSettings?.page_on_front,\n\t\t\tpostsPageId: siteSettings?.page_for_posts,\n\t\t};\n\t}, [] );\n\treturn (\n\t\t<BaseTitleView item={ item } className=\"fields-field__page-title\">\n\t\t\t{ [ frontPageId, postsPageId ].includes( item.id as number ) && (\n\t\t\t\t<~~span className=\"fields-field__page-title__badge\"~~>\n\t\t\t\t\t{ item.id === frontPageId\n\t\t\t\t\t\t? __( 'Homepage' )\n\t\t\t\t\t\t: __( 'Posts Page' ) }\n\t\t\t\t</~~span~~>\n\t\t\t) }\n\t\t</BaseTitleView>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,SAAS,QAAQ,iBAAiB;AAC3C,SAASC,KAAK,IAAIC,SAAS,QAAQ,sBAAsB;;~~AAGzD~~;AACA;AACA;;AAEA,SAASC,aAAa,QAAQ,eAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA;~~AAE9C~~,eAAe,~~SAASC~~,aAAaA,CAAE;EAAEC;AAA2B,CAAC,EAAG;EACvE,MAAM;IAAEC,WAAW;IAAEC;EAAY,CAAC,~~GAAGT~~,SAAS,~~CAAIU~~,MAAM,IAAM;IAC7D,MAAM;MAAEC;IAAgB,CAAC,GAAGD,MAAM,~~CAAER~~,SAAU,CAAC;IAC/C,~~MAAMU~~,YAAY,GAAGD,eAAe,CACnC,MAAM,EACN,MACD,CAAwB;IACxB,OAAO;MACNH,WAAW,EAAEI,YAAY,EAAEC,aAAa;MACxCJ,WAAW,EAAEG,YAAY,EAAEE;IAC5B,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EACP,~~oBACCT~~,IAAA,~~CAACF~~,aAAa;~~IAACI~~,IAAI,EAAGA,IAAM;IAACQ,SAAS,EAAC,0BAA0B;IAAAC,QAAA,EAC9D,CAAER,WAAW,EAAEC,WAAW,CAAE,CAACQ,QAAQ,CAAEV,IAAI,CAACW,EAAa,CAAC,~~iBAC3Db~~,IAAA~~;MAAMU~~,~~SAAS~~,~~EAAC,iCAAiC~~;~~MAAAC~~,QAAA,~~EAC9CT~~,IAAI,CAACW,EAAE,KAAKV,WAAW,~~GACtBT~~,EAAE,CAAE,UAAW,CAAC,GAChBA,EAAE,CAAE,YAAa;IAAC,~~CAChB~~;~~EACN~~,CACa,CAAC;AAElB","ignoreList":[]}
1	+ {"version":3,"names":["__","useSelect","store","coreStore","privateApis","componentsPrivateApis","BaseTitleView","unlock","jsx","_jsx","Badge","PageTitleView","item","frontPageId","postsPageId","select","getEntityRecord","siteSettings","page_on_front","page_for_posts","className","children","includes","id"],"sources":["@wordpress/fields/src/fields/page-title/view.tsx"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport type { Settings } from '@wordpress/core-data';\nimport { privateApis as componentsPrivateApis } from '@wordpress/components';\n\n/\n Internal dependencies\n */\nimport type { CommonPost } from '../../types';\nimport { BaseTitleView } from '../title/view';\nimport { unlock } from '../../lock-unlock';\nconst { Badge } = unlock( componentsPrivateApis );\n\nexport default function PageTitleView( { item }: { item: CommonPost } ) {\n\tconst { frontPageId, postsPageId } = useSelect( ( select ) => {\n\t\tconst { getEntityRecord } = select( coreStore );\n\t\tconst siteSettings = getEntityRecord(\n\t\t\t'root',\n\t\t\t'site'\n\t\t) as Partial< Settings >;\n\t\treturn {\n\t\t\tfrontPageId: siteSettings?.page_on_front,\n\t\t\tpostsPageId: siteSettings?.page_for_posts,\n\t\t};\n\t}, [] );\n\treturn (\n\t\t<BaseTitleView item={ item } className=\"fields-field__page-title\">\n\t\t\t{ [ frontPageId, postsPageId ].includes( item.id as number ) && (\n\t\t\t\t<Badge>\n\t\t\t\t\t{ item.id === frontPageId\n\t\t\t\t\t\t? __( 'Homepage' )\n\t\t\t\t\t\t: __( 'Posts Page' ) }\n\t\t\t\t</Badge>\n\t\t\t) }\n\t\t</BaseTitleView>\n\t);\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,SAAS,QAAQ,iBAAiB;AAC3C,SAASC,KAAK,IAAIC,SAAS,QAAQ,sBAAsB;AAEzD,SAASC,WAAW,IAAIC,qBAAqB,QAAQ,uBAAuB;;AAE5E;AACA;AACA;;AAEA,SAASC,aAAa,QAAQ,eAAe;AAC7C,SAASC,MAAM,QAAQ,mBAAmB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAC3C,MAAM;EAAEC;AAAM,CAAC,GAAGH,MAAM,CAAEF,qBAAsB,CAAC;AAEjD,eAAe,SAASM,aAAaA,CAAE;EAAEC;AAA2B,CAAC,EAAG;EACvE,MAAM;IAAEC,WAAW;IAAEC;EAAY,CAAC,GAAGb,SAAS,CAAIc,MAAM,IAAM;IAC7D,MAAM;MAAEC;IAAgB,CAAC,GAAGD,MAAM,CAAEZ,SAAU,CAAC;IAC/C,MAAMc,YAAY,GAAGD,eAAe,CACnC,MAAM,EACN,MACD,CAAwB;IACxB,OAAO;MACNH,WAAW,EAAEI,YAAY,EAAEC,aAAa;MACxCJ,WAAW,EAAEG,YAAY,EAAEE;IAC5B,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EACP,oBACCV,IAAA,CAACH,aAAa;IAACM,IAAI,EAAGA,IAAM;IAACQ,SAAS,EAAC,0BAA0B;IAAAC,QAAA,EAC9D,CAAER,WAAW,EAAEC,WAAW,CAAE,CAACQ,QAAQ,CAAEV,IAAI,CAACW,EAAa,CAAC,iBAC3Dd,IAAA,CAACC,KAAK;MAAAW,QAAA,EACHT,IAAI,CAACW,EAAE,KAAKV,WAAW,GACtBb,EAAE,CAAE,UAAW,CAAC,GAChBA,EAAE,CAAE,YAAa;IAAC,CACf;EACP,CACa,CAAC;AAElB","ignoreList":[]}

package/build-style/style-rtl.css CHANGED Viewed

@@ -121,50 +121,68 @@
 }
 .fields-create-template-part-modal__area-radio-group {
-  width: 100%;
-  border: 1px solid #757575;
+  border: 1px solid #949494;
   border-radius: 2px;
 }
-.fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio {
-  display: block;
-  width: 100%;
-  height: 100%;
-  text-align: right;
+.fields-create-template-part-modal__area-radio-wrapper {
+  position: relative;
   padding: 12px;
+  display: grid;
+  align-items: center;
+  grid-template-columns: min-content 1fr min-content;
+  grid-gap: 4px 8px;
+  color: #1e1e1e;
 }
-.fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio, .fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio.is-secondary:hover, .fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio.is-primary:hover {
-  margin: 0;
-  background-color: inherit;
-  border-bottom: 1px solid #757575;
-  border-radius: 0;
+.fields-create-template-part-modal__area-radio-wrapper + .fields-create-template-part-modal__area-radio-wrapper {
+  border-top: 1px solid #949494;
 }
-.fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio:not(:focus), .fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio.is-secondary:hover:not(:focus), .fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio.is-primary:hover:not(:focus) {
-  box-shadow: none;
+.fields-create-template-part-modal__area-radio-wrapper input[type=radio] {
+  position: absolute;
+  opacity: 0;
 }
-.fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio:focus, .fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio.is-secondary:hover:focus, .fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio.is-primary:hover:focus {
-  border-bottom: 1px solid #fff;
+.fields-create-template-part-modal__area-radio-wrapper:has(input[type=radio]:checked) {
+  z-index: 1;
 }
-.fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio:last-of-type, .fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio.is-secondary:hover:last-of-type, .fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio.is-primary:hover:last-of-type {
-  border-bottom: none;
+.fields-create-template-part-modal__area-radio-wrapper:has(input[type=radio]:not(:checked)):hover {
+  color: var(--wp-admin-theme-color);
 }
-.fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio:not(:hover), .fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio[aria-checked=true] {
-  color: #1e1e1e;
-  cursor: auto;
+.fields-create-template-part-modal__area-radio-wrapper > *:not(.fields-create-template-part-modal__area-radio-label) {
+  pointer-events: none;
 }
-.fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio:not(:hover) .fields-create-template-part-modal__option-label div, .fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio[aria-checked=true] .fields-create-template-part-modal__option-label div {
-  color: #949494;
+.fields-create-template-part-modal__area-radio-label::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+}
+input[type=radio]:not(:checked) ~ .fields-create-template-part-modal__area-radio-label::before {
+  cursor: pointer;
 }
-.fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio .fields-create-template-part-modal__option-label {
-  padding-top: 4px;
-  white-space: normal;
+input[type=radio]:focus-visible ~ .fields-create-template-part-modal__area-radio-label::before {
+  outline: 4px solid transparent;
+  box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 }
-.fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio .fields-create-template-part-modal__option-label div {
-  padding-top: 4px;
+.fields-create-template-part-modal__area-radio-icon,
+.fields-create-template-part-modal__area-radio-checkmark {
+  fill: currentColor;
+}
+input[type=radio]:not(:checked) ~ .fields-create-template-part-modal__area-radio-checkmark {
+  opacity: 0;
+}
+.fields-create-template-part-modal__area-radio-description {
+  grid-column: 2/3;
+  margin: 0;
+  color: #757575;
   font-size: 12px;
+  line-height: normal;
+  text-wrap: pretty;
 }
-.fields-create-template-part-modal__area-radio-group .components-button.fields-create-template-part-modal__area-radio .fields-create-template-part-modal__checkbox {
-  margin-right: auto;
-  min-width: 24px;
+input[type=radio]:not(:checked):hover ~ .fields-create-template-part-modal__area-radio-description {
+  color: inherit;
 }
 .fields-controls__slug .fields-controls__slug-external-icon {
@@ -234,7 +252,6 @@ fieldset.fields-controls__featured-image span {
 }
 fieldset.fields-controls__featured-image .fields-controls__featured-image-upload-button {
   padding: 0;
-  height: -moz-fit-content;
   height: fit-content;
 }
 fieldset.fields-controls__featured-image .fields-controls__featured-image-upload-button:hover, fieldset.fields-controls__featured-image .fields-controls__featured-image-upload-button:focus {
@@ -293,17 +310,6 @@ fieldset.fields-controls__featured-image .fields-controls__featured-image-remove
   flex-grow: 0;
 }
-.fields-field__page-title__badge {
-  background: #f0f0f0;
-  color: #2f2f2f;
-  padding: 0 4px;
-  border-radius: 2px;
-  font-size: 12px;
-  font-weight: 400;
-  flex-shrink: 0;
-  line-height: 20px;
-}
 .fields-field__pattern-title span:first-child {
   flex: 1;
 }