Converts paragraphs to headings with keyboard shortcuts

packages/edit-post/src/components/keyboard-shortcut-help-modal/config.js

@@ -36,4 +36,14 @@ export const textFormattingShortcuts = [
 		keyCombination: { modifier: 'access', character: 'x' },
 		description: __( 'Make the selected text inline code.' ),
 	},
+	{
+		keyCombination: { modifier: 'access', character: 'Level' },
+		description: __(
+			'Convert the current paragraph to a heading of level 1-6.'
+		),
+	},
+	{
+		keyCombination: { modifier: 'access', character: '0' },
+		description: __( 'Convert the current heading to a paragraph.' ),
+	},
 ];

packages/edit-post/src/components/keyboard-shortcuts/index.js

@@ -17,8 +17,11 @@ import { store as preferencesStore } from '@wordpress/preferences';
  * Internal dependencies
  */
 import { store as editPostStore } from '../../store';
+import { useTextLevelShortcuts } from '../../hooks';
 
 function KeyboardShortcuts() {
+	const [ registerTextLevelShortcuts, handleTextLevelShortcut ] =
+		useTextLevelShortcuts();
 	const { getBlockSelectionStart } = useSelect( blockEditorStore );
 	const {
 		getEditorMode,
@@ -145,6 +148,8 @@ function KeyboardShortcuts() {
 				character: 'h',
 			},
 		} );
+
+		registerTextLevelShortcuts();
 	}, [] );
 
 	useShortcut(
@@ -200,6 +205,35 @@ function KeyboardShortcuts() {
 		setIsListViewOpened( ! isListViewOpened() )
 	);
 
+	useShortcut(
+		'core/block-editor/transform-paragraph-to-heading-1',
+		( event ) => handleTextLevelShortcut( event, 1 )
+	);
+	useShortcut(
+		'core/block-editor/transform-paragraph-to-heading-2',
+		( event ) => handleTextLevelShortcut( event, 2 )
+	);
+	useShortcut(
+		'core/block-editor/transform-paragraph-to-heading-3',
+		( event ) => handleTextLevelShortcut( event, 3 )
+	);
+	useShortcut(
+		'core/block-editor/transform-paragraph-to-heading-4',
+		( event ) => handleTextLevelShortcut( event, 4 )
+	);
+	useShortcut(
+		'core/block-editor/transform-paragraph-to-heading-5',
+		( event ) => handleTextLevelShortcut( event, 5 )
+	);
+	useShortcut(
+		'core/block-editor/transform-paragraph-to-heading-6',
+		( event ) => handleTextLevelShortcut( event, 6 )
+	);
+	useShortcut(
+		'core/block-editor/transform-heading-to-paragraph',
+		( event ) => handleTextLevelShortcut( event, 0 )
+	);
+
 	return null;
 }
 

packages/edit-post/src/hooks/index.js

@@ -3,3 +3,6 @@
  */
 import './components';
 import './validate-multiple-use';
+import useTextLevelShortcuts from './useTextLevelShortcuts';
+
+export { useTextLevelShortcuts };

packages/edit-post/src/hooks/useTextLevelShortcuts.js

@@ -0,0 +1,73 @@
+/**
+ * WordPress dependencies
+ */
+import { select, useDispatch } from '@wordpress/data';
+import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
+import { __ } from '@wordpress/i18n';
+import { createBlock } from '@wordpress/blocks';
+import { store as blockEditorStore } from '@wordpress/block-editor';
+
+/**
+ * Registers keyboard shortcuts for blocks that participate
+ * in document structure such as paragraphs and headings, allowing
+ * a user to cycle through diverent document levels.
+ *
+ * @return {any} value
+ */
+export default function useTextLevelShortcuts() {
+	const { replaceBlocks } = useDispatch( blockEditorStore );
+	const { registerShortcut } = useDispatch( keyboardShortcutsStore );
+
+	return [
+		() => {
+			[ 1, 2, 3, 4, 5, 6 ].forEach( ( level ) => {
+				registerShortcut( {
+					name: `core/block-editor/transform-paragraph-to-heading-${ level }`,
+					category: 'block-library',
+					description: __( 'Transform paragraph to heading.' ),
+					keyCombination: {
+						modifier: 'access',
+						character: `${ level }`,
+					},
+				} );
+			} );
+			registerShortcut( {
+				name: `core/block-editor/transform-heading-to-paragraph`,
+				category: 'block-library',
+				description: __( 'Transform heading to paragraph.' ),
+				keyCombination: {
+					modifier: 'access',
+					character: `0`,
+				},
+			} );
+		},
+		( event, level ) => {
+			event.preventDefault();
+			const destinationBlockName =
+				level === 0 ? 'core/paragraph' : 'core/heading';
+			const {
+				getBlockName,
+				getSelectedBlockClientId,
+				getBlockAttributes,
+			} = select( blockEditorStore );
+			const currentClientId = getSelectedBlockClientId();
+			if (
+				getBlockName( currentClientId ) !== 'core/paragraph' &&
+				getBlockName( currentClientId ) !== 'core/heading'
+			) {
+				return;
+			}
+			const currentAttributes = getBlockAttributes( currentClientId );
+			const { content: currentContent, align: currentAlign } =
+				currentAttributes;
+			replaceBlocks(
+				currentClientId,
+				createBlock( destinationBlockName, {
+					level,
+					content: currentContent,
+					align: currentAlign,
+				} )
+			);
+		},
+	];
+}