From 6364b23030cc0761aa6a0561a1673e89dde47868 Mon Sep 17 00:00:00 2001
From: Nick Wing <wickning1@users.noreply.github.com>
Date: Sat, 16 Mar 2024 11:31:30 -0500
Subject: [PATCH] fix(checkbox): forward `on:focus`, `on:blur` to `Checkbox`
 and `InlineCheckbox` (#1937)

---
 COMPONENT_INDEX.md                  | 1 +
 docs/src/COMPONENT_API.json         | 1 +
 src/Checkbox/Checkbox.svelte        | 1 +
 src/Checkbox/InlineCheckbox.svelte  | 2 ++
 types/Checkbox/Checkbox.svelte.d.ts | 1 +
 5 files changed, 6 insertions(+)

diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md
index 4d27706932..211ce2e4ac 100644
--- a/COMPONENT_INDEX.md
+++ b/COMPONENT_INDEX.md
@@ -487,6 +487,7 @@ None.
 | mouseenter | forwarded  | --                   |
 | mouseleave | forwarded  | --                   |
 | change     | forwarded  | --                   |
+| focus      | forwarded  | --                   |
 | blur       | forwarded  | --                   |
 
 ## `CheckboxSkeleton`
diff --git a/docs/src/COMPONENT_API.json b/docs/src/COMPONENT_API.json
index 25ffb01201..664ad1681a 100644
--- a/docs/src/COMPONENT_API.json
+++ b/docs/src/COMPONENT_API.json
@@ -926,6 +926,7 @@
           "element": "CheckboxSkeleton"
         },
         { "type": "forwarded", "name": "change", "element": "input" },
+        { "type": "forwarded", "name": "focus", "element": "input" },
         { "type": "forwarded", "name": "blur", "element": "input" }
       ],
       "typedefs": [],
diff --git a/src/Checkbox/Checkbox.svelte b/src/Checkbox/Checkbox.svelte
index 429a4b87ec..5dc43b19ee 100644
--- a/src/Checkbox/Checkbox.svelte
+++ b/src/Checkbox/Checkbox.svelte
@@ -112,6 +112,7 @@
         }
       }}"
       on:change
+      on:focus
       on:blur
     />
     <label for="{id}" title="{title}" class:bx--checkbox-label="{true}">
diff --git a/src/Checkbox/InlineCheckbox.svelte b/src/Checkbox/InlineCheckbox.svelte
index 57a02af2ce..834abef0a5 100644
--- a/src/Checkbox/InlineCheckbox.svelte
+++ b/src/Checkbox/InlineCheckbox.svelte
@@ -29,6 +29,8 @@
     {...$$restProps}
     aria-checked="{indeterminate ? undefined : checked}"
     on:change
+    on:focus
+    on:blur
   />
   <label
     for="{id}"
diff --git a/types/Checkbox/Checkbox.svelte.d.ts b/types/Checkbox/Checkbox.svelte.d.ts
index e122878fa2..78fc4658e5 100644
--- a/types/Checkbox/Checkbox.svelte.d.ts
+++ b/types/Checkbox/Checkbox.svelte.d.ts
@@ -100,6 +100,7 @@ export default class Checkbox extends SvelteComponentTyped<
     mouseenter: WindowEventMap["mouseenter"];
     mouseleave: WindowEventMap["mouseleave"];
     change: WindowEventMap["change"];
+    focus: WindowEventMap["focus"];
     blur: WindowEventMap["blur"];
   },
   { labelText: {} }