From abcdb61ac261144ed1230a954250d23a709a9a50 Mon Sep 17 00:00:00 2001
From: Nandor_Czegledi <nandor.czegledi@instructure.com>
Date: Thu, 19 Feb 2026 13:55:26 +0100
Subject: [PATCH] fix(ui-checkbox): prevent blur on checkbox label mousedown by
 manually restoring focus to hidden input

---
 packages/ui-checkbox/src/Checkbox/index.tsx | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/packages/ui-checkbox/src/Checkbox/index.tsx b/packages/ui-checkbox/src/Checkbox/index.tsx
index 13f2740cce..83f834ff55 100644
--- a/packages/ui-checkbox/src/Checkbox/index.tsx
+++ b/packages/ui-checkbox/src/Checkbox/index.tsx
@@ -341,7 +341,18 @@ class Checkbox extends Component<CheckboxProps, CheckboxState> {
             onBlur={createChainedFunction(onBlur, this.handleBlur)}
             checked={this.checked}
           />
-          <label htmlFor={this.id} css={styles?.control}>
+          {/* Prevent the browser from firing a blur on the hidden input during
+              mousedown on the label, which would cause Focusable to lose focus
+              before the click event is processed. Manually restore focus instead. */}
+          <label
+            htmlFor={this.id}
+            css={styles?.control}
+            /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */
+            onMouseDown={(e) => {
+              e.preventDefault()
+              this._input?.focus()
+            }}
+          >
             {this.renderFacade()}
             {this.renderMessages()}
           </label>