Shortcut

Shortcut component is used to display keyboard shortcuts, and it can be customized with a custom display and aria label if needed.

View on Storybook

View source on GitHub

Import

import { Shortcut } from '@wordpress/components';

Props

NameTypeDefaultRequiredDescription
classNamestring

Classname to apply to the shortcut.

shortcutstring | { display: string; ariaLabel: string }

Shortcut configuration

Examples

Default

const Default = ( props ) => {
	return <Shortcut shortcut="Ctrl + S" { ...props } />;
};

With Aria Label

const WithAriaLabel = ( props ) => {
	return <Shortcut shortcut="Ctrl + S" { ...props } />;
};