From e7886650f960a9bc0c629c2598b85a85beb7bedc Mon Sep 17 00:00:00 2001
From: Hunter Johnston <64506580+huntabyte@users.noreply.github.com>
Date: Thu, 19 Oct 2023 19:35:49 -0400
Subject: [PATCH] expose additional events (#124)

---
 .changeset/twelve-avocados-exercise.md              |  5 +++++
 src/lib/bits/select/components/SelectContent.svelte |  6 +++++-
 src/lib/bits/select/components/SelectItem.svelte    | 11 ++++++++++-
 src/lib/bits/select/types.ts                        | 12 +++++++++++-
 4 files changed, 31 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/twelve-avocados-exercise.md

diff --git a/.changeset/twelve-avocados-exercise.md b/.changeset/twelve-avocados-exercise.md
new file mode 100644
index 000000000..1a6cefc72
--- /dev/null
+++ b/.changeset/twelve-avocados-exercise.md
@@ -0,0 +1,5 @@
+---
+"bits-ui": patch
+---
+
+expose additional events
diff --git a/src/lib/bits/select/components/SelectContent.svelte b/src/lib/bits/select/components/SelectContent.svelte
index 7470a94b8..0aa29bf54 100644
--- a/src/lib/bits/select/components/SelectContent.svelte
+++ b/src/lib/bits/select/components/SelectContent.svelte
@@ -39,6 +39,7 @@
 		use:melt={builder}
 		{...$$restProps}
 		on:m-pointerleave={dispatch}
+		on:keydown
 	>
 		<slot {builder} />
 	</div>
@@ -50,6 +51,7 @@
 		use:melt={builder}
 		{...$$restProps}
 		on:m-pointerleave={dispatch}
+		on:keydown
 	>
 		<slot {builder} />
 	</div>
@@ -60,6 +62,7 @@
 		use:melt={builder}
 		{...$$restProps}
 		on:m-pointerleave={dispatch}
+		on:keydown
 	>
 		<slot {builder} />
 	</div>
@@ -70,12 +73,13 @@
 		use:melt={builder}
 		{...$$restProps}
 		on:m-pointerleave={dispatch}
+		on:keydown
 	>
 		<slot {builder} />
 	</div>
 {:else if $open}
 	{@const builder = $menu}
-	<div use:melt={builder} {...$$restProps} on:m-pointerleave={dispatch}>
+	<div use:melt={builder} {...$$restProps} on:m-pointerleave={dispatch} on:keydown>
 		<slot {builder} />
 	</div>
 {/if}
diff --git a/src/lib/bits/select/components/SelectItem.svelte b/src/lib/bits/select/components/SelectItem.svelte
index 6de2d2a46..0de4bc152 100644
--- a/src/lib/bits/select/components/SelectItem.svelte
+++ b/src/lib/bits/select/components/SelectItem.svelte
@@ -23,7 +23,16 @@
 	<slot builder={$option({ value, disabled, label })} />
 {:else}
 	{@const builder = $option({ value, disabled, label })}
-	<div use:melt={builder} {...$$restProps} on:m-click={dispatch} on:m-pointermove={dispatch}>
+	<div
+		use:melt={builder}
+		{...$$restProps}
+		on:m-click={dispatch}
+		on:m-pointermove={dispatch}
+		on:focusin
+		on:keydown
+		on:focusout
+		on:pointerleave
+	>
 		<slot {builder}>
 			{label ? label : value}
 		</slot>
diff --git a/src/lib/bits/select/types.ts b/src/lib/bits/select/types.ts
index b811c7f2b..5e0d209e7 100644
--- a/src/lib/bits/select/types.ts
+++ b/src/lib/bits/select/types.ts
@@ -8,7 +8,12 @@ import type {
 	Transition,
 	TransitionProps
 } from "$lib/internal/index.js";
-import type { HTMLAttributes, HTMLButtonAttributes, HTMLInputAttributes } from "svelte/elements";
+import type {
+	EventHandler,
+	HTMLAttributes,
+	HTMLButtonAttributes,
+	HTMLInputAttributes
+} from "svelte/elements";
 import type { CustomEventHandler } from "$lib/index.js";
 
 type Props = Expand<
@@ -51,6 +56,10 @@ type ArrowProps = Expand<
 type ItemEvents<T extends Element = HTMLDivElement> = {
 	click: CustomEventHandler<MouseEvent, T>;
 	pointermove: CustomEventHandler<PointerEvent, T>;
+	focusin: EventHandler<FocusEvent, T>;
+	keydown: EventHandler<KeyboardEvent, T>;
+	focusout: EventHandler<FocusEvent, T>;
+	pointerleave: EventHandler<PointerEvent, T>;
 };
 
 type TriggerEvents<T extends Element = HTMLButtonElement> = {
@@ -63,6 +72,7 @@ type LabelEvents<T extends Element = HTMLSpanElement> = {
 };
 type ContentEvents<T extends Element = HTMLDivElement> = {
 	pointerleave: CustomEventHandler<PointerEvent, T>;
+	keydown: EventHandler<KeyboardEvent, T>;
 };
 
 export type {