fix: select events (#71)

huntabyte · Aug 21, 2023 · 9f21863 · 9f21863
1 parent c646c47
commit 9f21863
Show file tree

Hide file tree

Showing 6 changed files with 35 additions and 18 deletions.
diff --git a/.changeset/twelve-tables-kick.md b/.changeset/twelve-tables-kick.md
@@ -0,0 +1,5 @@
+---
+"bits-ui": patch
+---
+
+Fix: Select events
diff --git a/src/lib/bits/context-menu/components/ContextMenuSubTrigger.svelte b/src/lib/bits/context-menu/components/ContextMenuSubTrigger.svelte
@@ -30,6 +30,7 @@
 		on:m-keydown
 		on:m-pointerleave
 		on:m-pointermove
+		on:m-keydown
 		{...disabledAttrs(disabled)}
 	>
 		<slot {builder} />

diff --git a/src/lib/bits/context-menu/types.ts b/src/lib/bits/context-menu/types.ts
@@ -92,25 +92,19 @@ type ArrowProps = Expand<
 > &
 	HTMLDivAttributes;
 
-type CheckboxItemEvents = {
-	"m-click": DivEventHandler<MouseEvent>;
-	"m-keydown": DivEventHandler<KeyboardEvent>;
-};
-
 type ItemEvents = {
 	"m-click": DivEventHandler<MouseEvent>;
 	"m-keydown": DivEventHandler<KeyboardEvent>;
+	"m-focusin": DivEventHandler<FocusEvent>;
+	"m-focusout": DivEventHandler<FocusEvent>;
+	"m-pointerdown": DivEventHandler<MouseEvent>;
+	"m-pointerleave": DivEventHandler<MouseEvent>;
+	"m-pointermove": DivEventHandler<MouseEvent>;
 };
 
-type RadioItemEvents = {
-	"m-click": DivEventHandler<MouseEvent>;
-	"m-keydown": DivEventHandler<KeyboardEvent>;
-};
-
-type SubTriggerEvents = {
-	"m-click": DivEventHandler<MouseEvent>;
-	"m-keydown": DivEventHandler<KeyboardEvent>;
-};
+type CheckboxItemEvents = ItemEvents;
+type RadioItemEvents = ItemEvents;
+type SubTriggerEvents = Omit<ItemEvents, "m-pointerdown">;
 
 type TriggerEvents = {
 	"m-pointerdown": DivEventHandler<MouseEvent>;

diff --git a/src/lib/bits/dropdown-menu/types.ts b/src/lib/bits/dropdown-menu/types.ts
@@ -102,11 +102,16 @@ type ArrowProps = Expand<
 type ItemEvents = {
 	"m-click": DivEventHandler<MouseEvent>;
 	"m-keydown": DivEventHandler<KeyboardEvent>;
+	"m-focusin": DivEventHandler<FocusEvent>;
+	"m-focusout": DivEventHandler<FocusEvent>;
+	"m-pointerdown": DivEventHandler<MouseEvent>;
+	"m-pointerleave": DivEventHandler<MouseEvent>;
+	"m-pointermove": DivEventHandler<MouseEvent>;
 };
 
 type CheckboxItemEvents = ItemEvents;
 type RadioItemEvents = ItemEvents;
-type SubTriggerEvents = ItemEvents;
+type SubTriggerEvents = Omit<ItemEvents, "m-pointerdown">;
 
 type TriggerEvents = {
 	"m-click": ButtonEventHandler<MouseEvent>;

diff --git a/src/lib/bits/select/types.ts b/src/lib/bits/select/types.ts
@@ -10,7 +10,7 @@ import type {
 	TransitionProps
 } from "$internal/index.js";
 import type { HTMLAttributes, HTMLButtonAttributes, HTMLInputAttributes } from "svelte/elements";
-import type { ButtonEventHandler, DivEventHandler } from "$lib/index.js";
+import type { ButtonEventHandler, DivEventHandler, MEventHandler } from "$lib/index.js";
 
 type Props = Expand<
 	OmitOpen<OmitValue<Omit<CreateSelectProps, "defaultValueLabel">>> & {
@@ -53,15 +53,23 @@ type ArrowProps = Expand<
 type ItemEvents = {
 	"m-click": DivEventHandler<MouseEvent>;
 	"m-keydown": DivEventHandler<KeyboardEvent>;
+	"m-focusin": DivEventHandler<FocusEvent>;
+	"m-focusout": DivEventHandler<FocusEvent>;
+	"m-pointerleave": DivEventHandler<MouseEvent>;
+	"m-pointermove": DivEventHandler<MouseEvent>;
 };
 
 type TriggerEvents = {
 	"m-click": ButtonEventHandler<MouseEvent>;
 	"m-keydown": ButtonEventHandler<KeyboardEvent>;
 };
 
-type LabelEvents = SelectComponentEvents["label"];
-type ContentEvents = SelectComponentEvents["menu"];
+type LabelEvents = {
+	"m-click": MEventHandler<MouseEvent, HTMLSpanElement>;
+};
+type ContentEvents = {
+	"m-keydown": DivEventHandler<KeyboardEvent>;
+};
 
 export type {
 	Props,

diff --git a/src/lib/helpers/event-handlers.ts b/src/lib/helpers/event-handlers.ts
@@ -9,3 +9,7 @@ export type DivEventHandler<T extends Event = Event> = T & {
 export type SpanEventHandler<T extends Event = Event> = T & {
 	currentTarget: EventTarget & HTMLSpanElement;
 };
+
+export type MEventHandler<T extends Event = Event, M extends Element = Element> = T & {
+	currentTarget: EventTarget & M;
+};