diff --git a/packages/roosterjs-editor-api/lib/format/toggleBullet.ts b/packages/roosterjs-editor-api/lib/format/toggleBullet.ts index 9f5e3579bc6..3fe8561b3e8 100644 --- a/packages/roosterjs-editor-api/lib/format/toggleBullet.ts +++ b/packages/roosterjs-editor-api/lib/format/toggleBullet.ts @@ -13,7 +13,8 @@ import type { CompatibleBulletListType } from 'roosterjs-editor-types/lib/compat */ export default function toggleBullet( editor: IEditor, - listStyle?: BulletListType | CompatibleBulletListType + listStyle?: BulletListType | CompatibleBulletListType, + autoFormat?: boolean ) { toggleListType( editor, @@ -21,6 +22,7 @@ export default function toggleBullet( undefined /* startNumber */, false /* includeSiblingLists */, undefined /** orderedStyle */, - listStyle + listStyle, + autoFormat ); } diff --git a/packages/roosterjs-editor-api/lib/format/toggleNumbering.ts b/packages/roosterjs-editor-api/lib/format/toggleNumbering.ts index 8b0762cfbf3..8e56c07eb2d 100644 --- a/packages/roosterjs-editor-api/lib/format/toggleNumbering.ts +++ b/packages/roosterjs-editor-api/lib/format/toggleNumbering.ts @@ -15,13 +15,16 @@ import type { CompatibleNumberingListType } from 'roosterjs-editor-types/lib/com export default function toggleNumbering( editor: IEditor, startNumber?: number, - listStyle?: NumberingListType | CompatibleNumberingListType + listStyle?: NumberingListType | CompatibleNumberingListType, + autoFormat?: boolean ) { toggleListType( editor, ListType.Ordered, startNumber, undefined /* includeSiblingLists */, - listStyle + listStyle, + undefined /* unorderedStyle */, + autoFormat ); } diff --git a/packages/roosterjs-editor-api/lib/utils/toggleListType.ts b/packages/roosterjs-editor-api/lib/utils/toggleListType.ts index ee53656bb96..c3d886f0eee 100644 --- a/packages/roosterjs-editor-api/lib/utils/toggleListType.ts +++ b/packages/roosterjs-editor-api/lib/utils/toggleListType.ts @@ -38,7 +38,8 @@ export default function toggleListType( startNumber?: number, includeSiblingLists: boolean = true, orderedStyle?: NumberingListType | CompatibleNumberingListType, - unorderedStyle?: BulletListType | CompatibleBulletListType + unorderedStyle?: BulletListType | CompatibleBulletListType, + autoFormat?: boolean ) { blockFormat( editor, @@ -65,6 +66,6 @@ export default function toggleListType( } }, undefined /* beforeRunCallback */, - 'toggleListType' + autoFormat ? 'autoToggleListType' : 'toggleListType' ); } diff --git a/packages/roosterjs-editor-plugins/lib/plugins/AutoFormat/AutoFormat.ts b/packages/roosterjs-editor-plugins/lib/plugins/AutoFormat/AutoFormat.ts index 8a701e5b4bd..a3a0312aac1 100644 --- a/packages/roosterjs-editor-plugins/lib/plugins/AutoFormat/AutoFormat.ts +++ b/packages/roosterjs-editor-plugins/lib/plugins/AutoFormat/AutoFormat.ts @@ -1,4 +1,5 @@ import { + ChangeSource, EditorPlugin, IEditor, PluginEvent, @@ -15,6 +16,8 @@ export default class AutoFormat implements EditorPlugin { private editor: IEditor; private lastKeyTyped: string; + constructor(private enableAutoHyphen: boolean = true) {} + /** * Get a friendly name of this plugin */ @@ -42,57 +45,60 @@ export default class AutoFormat implements EditorPlugin { * @param event PluginEvent object */ onPluginEvent(event: PluginEvent) { - if ( - event.eventType === PluginEventType.ContentChanged || - event.eventType === PluginEventType.MouseDown || - event.eventType === PluginEventType.MouseUp - ) { - this.lastKeyTyped = ''; - } - - if (event.eventType === PluginEventType.KeyDown) { - const keyTyped = event.rawEvent.key; - - if (keyTyped.length > 1) { + if (this.enableAutoHyphen) { + if ( + event.eventType === PluginEventType.ContentChanged || + event.eventType === PluginEventType.MouseDown || + event.eventType === PluginEventType.MouseUp + ) { this.lastKeyTyped = ''; } - if ( - this.lastKeyTyped === '-' && - !specialCharacters.test(keyTyped) && - keyTyped !== ' ' && - keyTyped !== '-' - ) { - const searcher = this.editor.getContentSearcherOfCursor(event); - const textBeforeCursor = searcher.getSubStringBefore(3); - const dashes = searcher.getSubStringBefore(2); - const isPrecededByADash = textBeforeCursor[0] === '-'; - const isPrecededByASpace = textBeforeCursor[0] === ' '; + if (event.eventType === PluginEventType.KeyDown) { + const keyTyped = event.rawEvent.key; + + if (keyTyped.length > 1) { + this.lastKeyTyped = ''; + } + if ( - isPrecededByADash || - isPrecededByASpace || - specialCharacters.test(textBeforeCursor[0]) || - dashes !== '--' + this.lastKeyTyped === '-' && + !specialCharacters.test(keyTyped) && + keyTyped !== ' ' && + keyTyped !== '-' ) { - return; - } + const searcher = this.editor.getContentSearcherOfCursor(event); + const textBeforeCursor = searcher.getSubStringBefore(3); + const dashes = searcher.getSubStringBefore(2); + const isPrecededByADash = textBeforeCursor[0] === '-'; + const isPrecededByASpace = textBeforeCursor[0] === ' '; + if ( + isPrecededByADash || + isPrecededByASpace || + specialCharacters.test(textBeforeCursor[0]) || + dashes !== '--' + ) { + return; + } - const textRange = searcher.getRangeFromText(dashes, true /* exactMatch */); - const nodeHyphen = document.createTextNode('—'); - this.editor.addUndoSnapshot( - () => { - textRange.deleteContents(); - textRange.insertNode(nodeHyphen); - this.editor.select(nodeHyphen, PositionType.End); - }, - null /*changeSource*/, - true /*canUndoByBackspace*/ - ); + const textRange = searcher.getRangeFromText(dashes, true /* exactMatch */); + const nodeHyphen = document.createTextNode('—'); + this.editor.addUndoSnapshot( + () => { + textRange.deleteContents(); + textRange.insertNode(nodeHyphen); + this.editor.select(nodeHyphen, PositionType.End); + }, + ChangeSource.Format /*changeSource*/, + true /*canUndoByBackspace*/, + { formatApiName: 'autoHyphen' } + ); - //After the substitution the last key typed needs to be cleaned - this.lastKeyTyped = ''; - } else { - this.lastKeyTyped = keyTyped; + //After the substitution the last key typed needs to be cleaned + this.lastKeyTyped = ''; + } else { + this.lastKeyTyped = keyTyped; + } } } } diff --git a/packages/roosterjs-editor-plugins/lib/plugins/ContentEdit/features/listFeatures.ts b/packages/roosterjs-editor-plugins/lib/plugins/ContentEdit/features/listFeatures.ts index 22928a6a6d7..5d01d131430 100644 --- a/packages/roosterjs-editor-plugins/lib/plugins/ContentEdit/features/listFeatures.ts +++ b/packages/roosterjs-editor-plugins/lib/plugins/ContentEdit/features/listFeatures.ts @@ -231,7 +231,7 @@ const AutoBulletList: BuildInEditFeature = { if (textRange) { prepareAutoBullet(editor, textRange); - toggleBullet(editor, listStyle); + toggleBullet(editor, listStyle, true /** autoFormat */); } searcher.getRangeFromText(textBeforeCursor, true /*exactMatch*/)?.deleteContents(); }, @@ -271,10 +271,15 @@ const AutoNumberingList: BuildInEditFeature = { } else if ((regions = editor.getSelectedRegions()) && regions.length == 1) { const num = parseInt(textBeforeCursor); prepareAutoBullet(editor, textRange); - toggleNumbering(editor, num, listStyle); + toggleNumbering(editor, num, listStyle, true /** autoFormat */); } else { prepareAutoBullet(editor, textRange); - toggleNumbering(editor, undefined /* startNumber*/, listStyle); + toggleNumbering( + editor, + undefined /* startNumber*/, + listStyle, + true /** autoFormat */ + ); } searcher.getRangeFromText(textBeforeCursor, true /*exactMatch*/)?.deleteContents(); },