Name: Typix
Author: Diyorbek Juraev

The Short Cuts extension registers keyboard shortcuts for common formatting, block, alignment, and font size operations.

Demo

Loading preview...

import {  EditorContent,  EditorRoot,  createEditorConfig,  defaultExtensionNodes,} from "@typix-editor/react";import { ShortCutsExtension } from "@typix-editor/extension-short-cuts";import { theme } from "./theme";import "./style.css";const config = createEditorConfig({  extensionNodes: defaultExtensionNodes,  theme,});export default function ShortCutsExample() {  return (    <EditorRoot config={config}>      <EditorContent placeholder="Try keyboard shortcuts..." />      <ShortCutsExtension />    </EditorRoot>  );}

Installation

pnpm add @typix-editor/extension-short-cuts

npm install @typix-editor/extension-short-cuts

yarn add @typix-editor/extension-short-cuts

Setup

import { ShortCutsExtension } from '@typix-editor/extension-short-cuts';

function MyEditor() {
  return (
    <EditorRoot>
      <EditorContent />
      <ShortCutsExtension />
    </EditorRoot>
  );
}

Props

Prop	Type	Default	Description
`onLinkEditModeChange`	`(isLinkEditMode: boolean) => void`	—	Callback when link edit mode toggles

Available shortcuts

Block formatting

Shortcut	Action
`Ctrl+Alt+0`	Paragraph
`Ctrl+Alt+1`–`6`	Heading 1–6
`Ctrl+Alt+7`	Bullet list
`Ctrl+Alt+8`	Numbered list
`Ctrl+Alt+9`	Check list
`Ctrl+Shift+C`	Code block
`Ctrl+Shift+Q`	Block quote

Text formatting

Shortcut	Action
`Ctrl+Shift+S`	Strikethrough
`Ctrl+Shift+L`	Lowercase
`Ctrl+Shift+U`	Uppercase
`Ctrl+Shift+K`	Capitalize
`Ctrl+,`	Subscript
`Ctrl+.`	Superscript
`Ctrl+Shift+E`	Inline code

Alignment

Shortcut	Action
`Ctrl+Shift+L`	Left align
`Ctrl+Shift+E`	Center align
`Ctrl+Shift+R`	Right align
`Ctrl+Shift+J`	Justify

Other

Shortcut	Action
`Ctrl+Shift+=`	Increase font size
`Ctrl+Shift+-`	Decrease font size
`Ctrl+Shift+X`	Clear formatting
`Ctrl+K`	Insert/toggle link
`Ctrl+]`	Indent
`Ctrl+[`	Outdent

On macOS, Ctrl is replaced with Cmd.

Exports

Export	Type	Description
`ShortCutsExtension`	Component	The keyboard shortcuts plugin
`ShortCutsExtensionProps`	Type	Props type
`SHORTCUTS`	Object	Shortcut definitions for reference

Short Cuts

On this page