feat: expose more dialog content events (#300)

huntabyte · Jan 28, 2024 · 4439baf · 4439baf
1 parent 9852216
commit 4439baf
Show file tree

Hide file tree

Showing 6 changed files with 53 additions and 4 deletions.
diff --git a/.changeset/violet-dodos-kiss.md b/.changeset/violet-dodos-kiss.md
@@ -0,0 +1,5 @@
+---
+"bits-ui": minor
+---
+
+feat: forward/expose `touch` events on `Dialog.Content` & `AlertDialog.Content` components 
diff --git a/src/content/api-reference/extended-types/index.d.ts b/src/content/api-reference/extended-types/index.d.ts
diff --git a/src/lib/bits/alert-dialog/components/alert-dialog-content.svelte b/src/lib/bits/alert-dialog/components/alert-dialog-content.svelte
@@ -46,6 +46,10 @@
 		on:pointerdown
 		on:pointermove
 		on:pointerup
+		on:touchend
+		on:touchstart
+		on:touchcancel
+		on:touchmove
 		{...$$restProps}
 	>
 		<slot {builder} />
@@ -59,6 +63,10 @@
 		on:pointerdown
 		on:pointermove
 		on:pointerup
+		on:touchend
+		on:touchstart
+		on:touchcancel
+		on:touchmove
 		{...$$restProps}
 	>
 		<slot {builder} />
@@ -71,6 +79,10 @@
 		on:pointerdown
 		on:pointermove
 		on:pointerup
+		on:touchend
+		on:touchstart
+		on:touchcancel
+		on:touchmove
 		{...$$restProps}
 	>
 		<slot {builder} />
@@ -83,6 +95,10 @@
 		on:pointerdown
 		on:pointermove
 		on:pointerup
+		on:touchend
+		on:touchstart
+		on:touchcancel
+		on:touchmove
 		{...$$restProps}
 	>
 		<slot {builder} />
@@ -94,6 +110,10 @@
 		on:pointerdown
 		on:pointermove
 		on:pointerup
+		on:touchend
+		on:touchstart
+		on:touchcancel
+		on:touchmove
 		{...$$restProps}
 	>
 		<slot {builder} />

diff --git a/src/lib/bits/alert-dialog/types.ts b/src/lib/bits/alert-dialog/types.ts
@@ -37,6 +37,10 @@ type ContentEvents<T extends Element = HTMLElement> = {
 	pointerdown: SvelteEvent<PointerEvent, T>;
 	pointerup: SvelteEvent<PointerEvent, T>;
 	pointermove: SvelteEvent<PointerEvent, T>;
+	touchend: SvelteEvent<TouchEvent, T>;
+	touchstart: SvelteEvent<TouchEvent, T>;
+	touchcancel: SvelteEvent<TouchEvent, T>;
+	touchmove: SvelteEvent<TouchEvent, T>;
 };
 
 type ActionEvents = TriggerEvents;

diff --git a/src/lib/bits/dialog/components/dialog-content.svelte b/src/lib/bits/dialog/components/dialog-content.svelte
@@ -48,6 +48,10 @@
 		on:pointerdown
 		on:pointermove
 		on:pointerup
+		on:touchend
+		on:touchstart
+		on:touchcancel
+		on:touchmove
 	>
 		<slot {builder} />
 	</div>
@@ -60,6 +64,10 @@
 		on:pointerdown
 		on:pointermove
 		on:pointerup
+		on:touchend
+		on:touchstart
+		on:touchcancel
+		on:touchmove
 		{...$$restProps}
 	>
 		<slot {builder} />
@@ -72,6 +80,10 @@
 		on:pointerdown
 		on:pointermove
 		on:pointerup
+		on:touchend
+		on:touchstart
+		on:touchcancel
+		on:touchmove
 		{...$$restProps}
 	>
 		<slot {builder} />
@@ -84,6 +96,10 @@
 		on:pointerdown
 		on:pointermove
 		on:pointerup
+		on:touchend
+		on:touchstart
+		on:touchcancel
+		on:touchmove
 		{...$$restProps}
 	>
 		<slot {builder} />
@@ -95,6 +111,10 @@
 		on:pointerdown
 		on:pointermove
 		on:pointerup
+		on:touchend
+		on:touchstart
+		on:touchcancel
+		on:touchmove
 		{...$$restProps}
 	>
 		<slot {builder} />

diff --git a/src/lib/bits/dialog/types.ts b/src/lib/bits/dialog/types.ts
@@ -38,6 +38,10 @@ type ContentEvents<T extends Element = HTMLElement> = {
 	pointerdown: SvelteEvent<PointerEvent, T>;
 	pointerup: SvelteEvent<PointerEvent, T>;
 	pointermove: SvelteEvent<PointerEvent, T>;
+	touchend: SvelteEvent<TouchEvent, T>;
+	touchstart: SvelteEvent<TouchEvent, T>;
+	touchcancel: SvelteEvent<TouchEvent, T>;
+	touchmove: SvelteEvent<TouchEvent, T>;
 };
 
 type TriggerEvents<T extends Element = HTMLButtonElement> = {