From 7a796149ca5131c2d04cb635ab813a3b39261c12 Mon Sep 17 00:00:00 2001
From: "ilia.brauer" <ilia.brauer@semrush.com>
Date: Tue, 26 May 2026 11:36:36 +0200
Subject: [PATCH] [inline-input] added handlers for Escape on buttons

---
 semcore/inline-input/src/InlineInput.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/semcore/inline-input/src/InlineInput.tsx b/semcore/inline-input/src/InlineInput.tsx
index 2ebbdcb4b7..a658a58784 100644
--- a/semcore/inline-input/src/InlineInput.tsx
+++ b/semcore/inline-input/src/InlineInput.tsx
@@ -62,6 +62,7 @@ type ControlAsProps = {
 };
 type ConfirmControlAsProps = ControlAsProps & {
   onConfirm?: OnConfirm;
+  onCancel?: OnCancel;
   inputRef?: React.RefObject<HTMLInputElement>;
 };
 type CancelControlAsProps = ControlAsProps & {
@@ -148,6 +149,7 @@ class InlineInputBase extends Component<RootAsProps> {
       inputRef: this.inputRef,
       loading,
       onConfirm: this.handleConfirm,
+      onCancel: this.handleCancel,
       getI18nText,
     };
   }
@@ -309,7 +311,7 @@ function Addon(props: AddonAsProps) {
 
 function ConfirmControl(props: ConfirmControlAsProps) {
   const SAddon = Root;
-  const { Children, children: hasChildren, inputRef } = props;
+  const { Children, children: hasChildren, inputRef, onCancel } = props;
   const title = props.title ?? props.getI18nText('confirm');
 
   const handleConfirm = React.useCallback(
@@ -326,6 +328,11 @@ function ConfirmControl(props: ConfirmControlAsProps) {
         event.stopPropagation();
         handleConfirm(event);
       }
+      if (event.key === 'Escape') {
+        event.preventDefault();
+        event.stopPropagation();
+        onCancel?.(inputRef?.current?.value ?? '', event);
+      }
     },
     [handleConfirm],
   );
@@ -373,7 +380,7 @@ function CancelControl(props: CancelControlAsProps) {
 
   const handleKeydown = React.useCallback(
     (event: React.KeyboardEvent) => {
-      if (event.key === 'Enter' || event.key === ' ') {
+      if (event.key === 'Enter' || event.key === ' ' || event.key === 'Escape') {
         event.preventDefault();
         event.stopPropagation();
         handleCancel(event);