RichText: Remove 'Footnotes' when interactive formatting is disabled (#…

…53474)

Introduce a new 'interactive' setting for format types

packages/block-editor/src/components/rich-text/use-format-types.js

@@ -66,21 +66,21 @@ export function useFormatTypes( {
 } ) {
 	const allFormatTypes = useSelect( formatTypesSelector, [] );
 	const formatTypes = useMemo( () => {
-		return allFormatTypes.filter( ( { name, tagName } ) => {
+		return allFormatTypes.filter( ( { name, interactive, tagName } ) => {
 			if ( allowedFormats && ! allowedFormats.includes( name ) ) {
 				return false;
 			}
 
 			if (
 				withoutInteractiveFormatting &&
-				interactiveContentTags.has( tagName )
+				( interactive || interactiveContentTags.has( tagName ) )
 			) {
 				return false;
 			}
 
 			return true;
 		} );
-	}, [ allFormatTypes, allowedFormats, interactiveContentTags ] );
+	}, [ allFormatTypes, allowedFormats, withoutInteractiveFormatting ] );
 	const keyedSelected = useSelect(
 		( select ) =>
 			formatTypes.reduce( ( accumulator, type ) => {

packages/block-library/src/footnotes/format.js

@@ -37,6 +37,7 @@ export const format = {
 	attributes: {
 		'data-fn': 'data-fn',
 	},
+	interactive: true,
 	contentEditable: false,
 	[ usesContextKey ]: [ 'postType' ],
 	edit: function Edit( {

packages/rich-text/src/register-format-type.js

@@ -13,6 +13,7 @@ import { store as richTextStore } from './store';
  *                                  unique across all registered formats.
  * @property {string}   tagName     The HTML tag this format will wrap the
  *                                  selection with.
+ * @property {boolean}  interactive Whether format makes content interactive or not.
  * @property {string}   [className] A class to match the format.
  * @property {string}   title       Name of the format.
  * @property {Function} edit        Should return a component for the user to