diff --git a/android/src/main/java/com/swmansion/enriched/textinput/EnrichedTextInputView.kt b/android/src/main/java/com/swmansion/enriched/textinput/EnrichedTextInputView.kt index 023cc20fc..53706ebe9 100644 --- a/android/src/main/java/com/swmansion/enriched/textinput/EnrichedTextInputView.kt +++ b/android/src/main/java/com/swmansion/enriched/textinput/EnrichedTextInputView.kt @@ -1005,6 +1005,19 @@ class EnrichedTextInputView : selection?.validateStyles() } + fun deleteAtSelection() { + runAsATransaction { + val start = selectionStart + val end = selectionEnd + + if (start != end) { + text?.delete(start, end) + } else if (start > 0) { + text?.delete(start - 1, start) + } + } + } + fun requestHTML(requestId: Int) { val html = try { diff --git a/android/src/main/java/com/swmansion/enriched/textinput/EnrichedTextInputViewManager.kt b/android/src/main/java/com/swmansion/enriched/textinput/EnrichedTextInputViewManager.kt index 9dcbb8244..f1b7775c0 100644 --- a/android/src/main/java/com/swmansion/enriched/textinput/EnrichedTextInputViewManager.kt +++ b/android/src/main/java/com/swmansion/enriched/textinput/EnrichedTextInputViewManager.kt @@ -479,6 +479,10 @@ class EnrichedTextInputViewManager : view?.setTextAlignment(alignment) } + override fun deleteAtSelection(view: EnrichedTextInputView?) { + view?.deleteAtSelection() + } + override fun measure( context: Context, localData: ReadableMap?, diff --git a/ios/EnrichedTextInputView.mm b/ios/EnrichedTextInputView.mm index a899aa629..5fc97329e 100644 --- a/ios/EnrichedTextInputView.mm +++ b/ios/EnrichedTextInputView.mm @@ -1296,6 +1296,8 @@ - (void)handleCommand:(const NSString *)commandName args:(const NSArray *)args { if (!_placeholderLabel.isHidden) { [self refreshPlaceholderLabelStyles]; } + } else if ([commandName isEqualToString:@"deleteAtSelection"]) { + [self deleteAtSelection]; } } @@ -1335,6 +1337,18 @@ - (void)setValue:(NSString *)value { [self anyTextMayHaveBeenModified]; } +- (void)deleteAtSelection { + UITextRange *selectedRange = self.textView.selectedTextRange; + + if (selectedRange.empty) { + [self.textView deleteBackward]; + } else { + [self.textView replaceRange:selectedRange withText:@""]; + } + + [self anyTextMayHaveBeenModified]; +} + - (void)setCustomSelection:(NSInteger)visibleStart end:(NSInteger)visibleEnd { NSString *text = textView.textStorage.string; diff --git a/src/native/EnrichedTextInput.tsx b/src/native/EnrichedTextInput.tsx index feffab4cc..e339360a3 100644 --- a/src/native/EnrichedTextInput.tsx +++ b/src/native/EnrichedTextInput.tsx @@ -277,6 +277,9 @@ export const EnrichedTextInput = ({ ) => { Commands.setTextAlignment(nullthrows(nativeRef.current), alignment); }, + deleteAtSelection: () => { + Commands.deleteAtSelection(nullthrows(nativeRef.current)); + }, })); const handleMentionEvent = (e: NativeSyntheticEvent) => { diff --git a/src/spec/EnrichedTextInputNativeComponent.ts b/src/spec/EnrichedTextInputNativeComponent.ts index 20e9d12b4..6044babd1 100644 --- a/src/spec/EnrichedTextInputNativeComponent.ts +++ b/src/spec/EnrichedTextInputNativeComponent.ts @@ -482,6 +482,7 @@ interface NativeCommands { viewRef: React.ElementRef, alignment: string ) => void; + deleteAtSelection: (viewRef: React.ElementRef) => void; } export const Commands: NativeCommands = codegenNativeCommands({ @@ -516,6 +517,7 @@ export const Commands: NativeCommands = codegenNativeCommands({ 'addMention', 'requestHTML', 'setTextAlignment', + 'deleteAtSelection', ], }); diff --git a/src/types.ts b/src/types.ts index acda85b41..75c5b62e8 100644 --- a/src/types.ts +++ b/src/types.ts @@ -564,6 +564,12 @@ export interface EnrichedTextInputInstance extends NativeMethods { setTextAlignment: ( alignment: 'left' | 'center' | 'right' | 'justify' | 'auto' ) => void; + + /** + * Deletes text at current selection. If there is no selection - deletes one character + * backwards. + */ + deleteAtSelection: () => void; } export interface ContextMenuItem { diff --git a/src/web/EnrichedTextInput.tsx b/src/web/EnrichedTextInput.tsx index 8ec53d0d7..f1c0dc983 100644 --- a/src/web/EnrichedTextInput.tsx +++ b/src/web/EnrichedTextInput.tsx @@ -376,6 +376,17 @@ export const EnrichedTextInput = ({ runFocused(editor, (c) => c.setTextAlign(alignment)); } }, + deleteAtSelection: () => { + runFocused(editor, (c) => { + const { from, to } = editor.state.selection; + + if (from !== to) { + return c.deleteSelection(); + } else { + return c.deleteRange({ from: from - 1, to }); + } + }); + }, }), [editor, mentionIndicatorsRef, useHtmlNormalizerRef] );