Autoformat
Allows you to apply formatting based on character sequences, such as automatically converting #
into an H1. This package also provides predefined rules.
#
Installation- npm
- Yarn
#
Usageimport React from 'react'; import { AutoformatPlugin, createAutoformatPlugin, createExitBreakPlugin, createHorizontalRulePlugin, createListPlugin, createResetNodePlugin, createSoftBreakPlugin, Plate, } from '@udecode/plate'; import { autoformatPlugin } from './autoformat/autoformatPlugin'; import { autoformatValue } from './autoformat/autoformatValue'; import { basicNodesPlugins } from './basic-nodes/basicNodesPlugins'; import { editableProps } from './common/editableProps'; import { plateUI } from './common/plateUI'; import { exitBreakPlugin } from './exit-break/exitBreakPlugin'; import { resetBlockTypePlugin } from './reset-node/resetBlockTypePlugin'; import { softBreakPlugin } from './soft-break/softBreakPlugin'; import { createMyPlugins, MyEditor, MyValue } from './typescript/plateTypes'; const plugins = createMyPlugins( [ ...basicNodesPlugins, createListPlugin(), createHorizontalRulePlugin(), createResetNodePlugin(resetBlockTypePlugin), createSoftBreakPlugin(softBreakPlugin), createExitBreakPlugin(exitBreakPlugin), createAutoformatPlugin<AutoformatPlugin<MyValue, MyEditor>, MyValue>( autoformatPlugin ), ], { components: plateUI, } ); export default () => ( <Plate<MyValue> editableProps={editableProps} initialValue={autoformatValue} plugins={plugins} /> );
#
RulesThis package provides the following rules:
Name | Description |
---|---|
autoformatSmartQuotes | Converts "text" to “text” . |
Converts 'text' to ‘text’ . | |
autoformatPunctuation | Converts -- to — . |
Converts ... to … . | |
Converts >> to » . | |
Converts << to « . | |
autoformatArrow | Converts -> to → . |
Converts <- to ← . | |
Converts => to ⇒ . | |
Converts <= and ≤= to ⇐ . | |
autoformatLegal | Converts (tm) and (TM) to ™ . |
Converts (r) and (R) to ® . | |
Converts (c) and (C) to © . | |
autoformatLegalHtml | Converts ™ to ™ . |
Converts ® to ® . | |
Converts © to © . | |
Converts § to § . | |
autoformatComparison | Converts !> to !> . |
Converts !< to ≮ . | |
Converts >= to ≥ . | |
Converts <= to ≤ . | |
Converts !>= to ≱ . | |
Converts !<= to ≰ . | |
autoformatEquality | Converts != to ≠ . |
Converts == to ≡ . | |
Converts !== and ≠= to ≢ . | |
Converts ~= to ≈ . | |
Converts !~= to ≉ . | |
autoformatFraction | Converts 1/2 to ½ . |
Converts 1/3 to ⅓ . | |
... | |
Converts 7/8 to ⅞ . | |
autoformatDivision | Converts // to ÷ . |
autoformatOperation | Converts +- to ± . |
Converts %% to ‰ . | |
Converts %%% and ‰% to `‱. | |
autoformatDivision rules. | |
autoformatSubscriptNumbers | Converts ~0 to ₀ . |
Converts ~1 to ₁ . | |
... | |
Converts ~9 to ₉ . | |
autoformatSubscriptSymbols | Converts ~+ to ₊ . |
Converts ~- to ₋ . | |
autoformatSuperscriptNumbers | Converts ^0 to ⁰ . |
Converts ^1 to ¹ . | |
... | |
Converts ^9 to ⁹ . | |
autoformatSuperscriptSymbols | Converts ^+ to ° . |
Converts ^- to ⁺ . | |
autoformatMath | autoformatComparison rules |
autoformatEquality rules | |
autoformatOperation rules | |
autoformatFraction rules | |
autoformatSubscriptNumbers rules | |
autoformatSubscriptSymbols rules | |
autoformatSuperscriptNumbers rules | |
autoformatSuperscriptSymbols rules |