@octanejs/aria 0.0.46 → 0.0.48

package/src/interactions/createKeyboardShortcutHandler.tsx

@@ -0,0 +1,218 @@
+/** @jsxImportSource octane */
+// Ported from adobe/react-spectrum@5ecb3333001313e83898cd07644227897e3bae1f (packages/react-aria/src/interactions/createKeyboardShortcutHandler.ts).
+/*
+ * Copyright 2025 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+import { isMac } from '../utils/platform';
+import type { BaseEvent } from './createEventHandler';
+type KeyboardEvent = BaseEvent<globalThis.KeyboardEvent>;
+
+export type KeyboardShortcutAction = (
+	e: KeyboardEvent,
+) =>
+	void | boolean | Partial<{ shouldContinuePropagation?: boolean; shouldPreventDefault?: boolean }>;
+
+/** Maps shortcut strings (e.g. `"Mod+s"`, `"Control+Shift+a"`) to handlers. */
+export type KeyboardShortcutBindings = Record<string, KeyboardShortcutAction>;
+
+/** Modifier names in shortcut strings (case-insensitive). Order in the string does not matter. */
+const MODIFIER_NAMES = new Set([
+	'shift',
+	'alt',
+	'control',
+	'meta',
+	'mod', // OS dependent - Cmd on Mac, Control on Windows/Linux
+]);
+
+/** Canonical modifier order for stable keys (sorted, fixed order). */
+const CANONICAL_MODIFIER_ORDER = ['Alt', 'Control', 'Meta', 'Shift'] as const;
+
+export interface ParsedKeyboardShortcut {
+	shift: boolean;
+	alt: boolean;
+	ctrl: boolean;
+	meta: boolean;
+	/**
+	 * Platform primary: Cmd on Mac, Control on Windows/Linux — expands to Meta or Control in
+	 * canonical form.
+	 */
+	mod: boolean;
+	key: string;
+}
+
+/**
+ * Builds the set of canonical modifier tokens for a binding.
+ * `Mod` contributes Meta (Mac) or Ctrl (non-Mac); explicit Ctrl/Meta add those keys too.
+ */
+export function modifierSetFromParsed(parsed: ParsedKeyboardShortcut): Set<string> {
+	let set = new Set<string>();
+	if (parsed.alt) {
+		set.add('Alt');
+	}
+	if (parsed.shift) {
+		set.add('Shift');
+	}
+	if (parsed.ctrl) {
+		set.add('Control');
+	}
+	if (parsed.meta) {
+		set.add('Meta');
+	}
+	if (parsed.mod) {
+		set.add(isMac() ? 'Meta' : 'Control');
+	}
+	return set;
+}
+
+/** Modifier set from a keydown event (native flags only). */
+export function modifierSetFromEvent(e: KeyboardEvent): Set<string> {
+	let set = new Set<string>();
+	if (e.altKey) {
+		set.add('Alt');
+	}
+	if (e.ctrlKey) {
+		set.add('Control');
+	}
+	if (e.metaKey) {
+		set.add('Meta');
+	}
+	if (e.shiftKey) {
+		set.add('Shift');
+	}
+	return set;
+}
+
+function sortedModifierTokens(set: Set<string>): string[] {
+	return CANONICAL_MODIFIER_ORDER.filter((name) => set.has(name));
+}
+
+/**
+ * Parses a shortcut like `"Mod+Shift+z"`, `"Ctrl+Alt+Enter"`, or `"Escape"`.
+ * Modifiers are case-insensitive; order does not matter. `control` is an alias for `ctrl`.
+ */
+export function parseKeyboardShortcut(spec: string): ParsedKeyboardShortcut {
+	let parts = spec.split('+').reduce<ParsedKeyboardShortcut>(
+		(prev, part) => {
+			let lower = part.toLowerCase();
+			if (MODIFIER_NAMES.has(lower)) {
+				if (lower === 'shift') {
+					prev.shift = true;
+				} else if (lower === 'alt') {
+					prev.alt = true;
+				} else if (lower === 'control') {
+					prev.ctrl = true;
+				} else if (lower === 'meta') {
+					prev.meta = true;
+				} else if (lower === 'mod') {
+					prev.mod = true;
+				}
+			} else {
+				prev.key = part;
+			}
+			return prev;
+		},
+		{ shift: false, alt: false, ctrl: false, meta: false, mod: false, key: '' },
+	);
+	if (parts.key === '') {
+		throw new Error(
+			`Invalid keyboard shortcut: "${spec}". Must include exactly one non-modifier key (e.g. "a", "Enter", "ArrowDown"). Combine any of Shift, Alt, Ctrl, Meta, and Mod.`,
+		);
+	}
+	return parts;
+}
+
+function normalizeEventKey(key: string): string {
+	return key.toLowerCase();
+}
+
+/** Short aliases for common keys (shortcut side, before match). */
+const KEY_ALIASES: Record<string, string> = {
+	space: ' ',
+	esc: 'escape',
+	del: 'delete',
+	ins: 'insert',
+	left: 'arrowleft',
+	right: 'arrowright',
+	up: 'arrowup',
+	down: 'arrowdown',
+	pageup: 'pageup',
+	pagedown: 'pagedown',
+};
+
+/** Canonical key segment (lowercase); aliases like `down` → `arrowdown`. */
+function canonicalKeyFromSpecKey(specKey: string): string {
+	let k = normalizeEventKey(specKey);
+	let aliased = KEY_ALIASES[k];
+	return aliased != null ? aliased : k;
+}
+
+/** Canonical shortcut string for a binding (modifiers sorted: Alt, Ctrl, Meta, Shift, then key). */
+export function canonicalKeyboardShortcut(parsed: ParsedKeyboardShortcut): string {
+	let mods = sortedModifierTokens(modifierSetFromParsed(parsed));
+	let key = canonicalKeyFromSpecKey(parsed.key);
+	return mods.length > 0 ? `${mods.join('+')}+${key}` : key;
+}
+
+/** Canonical shortcut string for a keydown event. */
+export function keyboardEventToCanonicalShortcut(e: KeyboardEvent): string {
+	let mods = sortedModifierTokens(modifierSetFromEvent(e));
+	let key = normalizeEventKey(e.key);
+	let prefix = mods.length > 0 ? `${mods.join('+')}+` : '';
+	return prefix + key;
+}
+
+/**
+ * Returns a keydown handler that runs the action only for an exact modifier+key match.
+ * Modifier order in the string does not matter (`Shift+Mod+a` ≡ `Mod+Shift+a`).
+ * Any combination of **Shift**, **Alt**, **Ctrl**, **Meta**, and **Mod** is allowed; **Mod** means
+ * Cmd on Apple platforms and Ctrl on Windows/Linux (same as before). **control** aliases **ctrl**.
+ *
+ * Duplicate bindings that normalize to the same shortcut: later object entries win.
+ *
+ * @example
+ *   ```tsx
+ *   let onKeyDown = createKeyboardShortcutHandler({
+ *     'Mod+s': e => {
+ *       e.preventDefault();
+ *       save();
+ *     },
+ *     'Ctrl+Shift+k': () => palette(),
+ *     'Meta+Alt+ArrowLeft': () => back()
+ *   });
+ *   ```;
+ */
+export function createKeyboardShortcutHandler(
+	bindings: KeyboardShortcutBindings,
+): (e: KeyboardEvent) => void {
+	let map = new Map<string, KeyboardShortcutAction>();
+	for (let [spec, action] of Object.entries(bindings)) {
+		let parsed = parseKeyboardShortcut(spec);
+		map.set(canonicalKeyboardShortcut(parsed), action);
+	}
+
+	return (e: KeyboardEvent) => {
+		let canonical = keyboardEventToCanonicalShortcut(e);
+		let action = map.get(canonical);
+		let result = action?.(e);
+		if (result === undefined && action !== undefined) {
+			result = { shouldContinuePropagation: false, shouldPreventDefault: true };
+		} else if (typeof result === 'boolean') {
+			result = { shouldContinuePropagation: !result, shouldPreventDefault: result };
+		}
+		if (result?.shouldPreventDefault) {
+			e.preventDefault();
+		}
+		if (!action || result?.shouldContinuePropagation) {
+			e.continuePropagation();
+		}
+	};
+}

package/src/interactions/textSelection.ts

@@ -4,7 +4,7 @@
 // `string`, which this repo's strict indexing rejects).
 import { getOwnerDocument } from '../utils/domHelpers';
 
-import { isIOS } from '../utils/platform';
+import { isIOS, isWebKit } from '../utils/platform';
 import { runAfterTransition } from '../utils/runAfterTransition';
 
 // Safari on iOS starts selecting text on long press. The only way to avoid this, it seems,
@@ -29,7 +29,7 @@ let savedUserSelect = '';
 let modifiedElementMap = new WeakMap<Element, string>();
 
 export function disableTextSelection(target?: Element): void {
-	if (isIOS()) {
+	if (isIOS() && isWebKit()) {
 		if (state === 'default') {
 			const documentObject = getOwnerDocument(target);
 			savedUserSelect = documentObject.documentElement.style.webkitUserSelect;
@@ -48,7 +48,7 @@ export function disableTextSelection(target?: Element): void {
 }
 
 export function restoreTextSelection(target?: Element): void {
-	if (isIOS()) {
+	if (isIOS() && isWebKit()) {
 		// If the state is already default, there's nothing to do.
 		// If it is restoring, then there's no need to queue a second restore.
 		if (state !== 'disabled') {

package/src/interactions/useContextMenu.tsx

@@ -0,0 +1,125 @@
+/** @jsxImportSource octane */
+// Ported from adobe/react-spectrum@5ecb3333001313e83898cd07644227897e3bae1f (packages/react-aria/src/interactions/useContextMenu.ts).
+/*
+ * Copyright 2020 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+import { HTMLAttributes, useRef } from '../compat/react';
+import { isIOS, isMac } from '../utils/platform';
+import { mergeProps } from '../utils/mergeProps';
+import { useLongPress } from './useLongPress';
+
+export interface ContextMenuEvent {
+	/** The target element on which the event was triggered. */
+	target: Element;
+	/** X position relative to the target. */
+	x: number;
+	/** Y position relative to the target. */
+	y: number;
+}
+
+export interface ContextMenuProps {
+	/** Event that is called when a context menu is triggered. */
+	onContextMenu?: (e: ContextMenuEvent) => void;
+}
+
+export interface ContextMenuAria {
+	/** Props to spread on the target element. */
+	contextMenuProps: HTMLAttributes<HTMLElement>;
+}
+
+/**
+ * Handles context menu events across mouse, touch, keyboard, and screen reader interactions.
+ */
+export function useContextMenu(props: ContextMenuProps): ContextMenuAria {
+	// How to trigger context menu events on various platforms:
+	// - macOS
+	//   - Mouse right click
+	//   - Control + click
+	//   - Control + Enter (does not fire the contextmenu event in certain WebKit / Chrome versions - https://bugs.webkit.org/show_bug.cgi?id=302049, https://issues.chromium.org/issues/369897039)
+	//   - Control + Option + Shift + M with VoiceOver
+	// - Windows / Linux
+	//   - Mouse right click
+	//   - Shift + F10
+	//   - Long press on a touch screen
+	// - iOS
+	//   - Long press (does not fire contextmenu event - https://bugs.webkit.org/show_bug.cgi?id=213953)
+	// - Android
+	//   - Long press
+
+	let { onContextMenu } = props;
+	let firedContextMenuEvent = useRef(false);
+
+	// iOS does not fire the contextmenu event, so use long press.
+	let { longPressProps } = useLongPress({
+		onLongPressStart() {
+			firedContextMenuEvent.current = false;
+		},
+		onLongPress(e) {
+			if (!firedContextMenuEvent.current) {
+				onContextMenu?.({ target: e.target, x: e.x, y: e.y });
+			} else {
+				firedContextMenuEvent.current = false;
+			}
+		},
+	});
+
+	if (!onContextMenu) {
+		return {
+			contextMenuProps: {},
+		};
+	}
+
+	return {
+		// oxlint-disable-next-line react/react-compiler - it says we are reading a ref during render but that's not true...
+		contextMenuProps: mergeProps(isIOS() ? longPressProps : {}, {
+			onContextMenu(e: import('octane').MouseEvent<HTMLElement>) {
+				e.stopPropagation();
+				e.preventDefault();
+				firedContextMenuEvent.current = true;
+
+				let rect = e.currentTarget.getBoundingClientRect();
+				onContextMenu({
+					target: e.currentTarget,
+					x: e.clientX - rect.x,
+					y: e.clientY - rect.y,
+				});
+			},
+			onKeyDown(e: import('octane').KeyboardEvent<HTMLElement>) {
+				// macOS has a default keyboard shortcut to show the contextmenu: Ctrl + Enter.
+				// However, some versions of Safari and Chrome do not trigger the contextmenu event.
+				// Fixed in https://github.com/WebKit/WebKit/pull/62278 (currently in WekKit nightly) and
+				// https://github.com/chromium/chromium/commit/268c876c191cd4712c2d1043aab9760fb71d9be5 (Chrome 147).
+				// Remove this workaround once those are broadly available.
+				// An additional bug still occurs when the target has a border-radius: https://bugs.webkit.org/show_bug.cgi?id=317496
+				if (isMac()) {
+					if (e.ctrlKey && e.key === 'Enter') {
+						firedContextMenuEvent.current = false;
+						let target = e.currentTarget;
+						e.stopPropagation();
+						setTimeout(() => {
+							if (!firedContextMenuEvent.current) {
+								let rect = target.getBoundingClientRect();
+								onContextMenu({
+									target,
+									x: rect.width / 2,
+									y: rect.height / 2,
+								});
+							} else {
+								firedContextMenuEvent.current = false;
+							}
+						}, 10);
+					}
+				}
+			},
+		} satisfies HTMLAttributes<HTMLElement>),
+	};
+}

package/src/interactions/useFocusVisible.ts

@@ -110,8 +110,8 @@ function handleFocusEvent(e: FocusEvent) {
 	// Firefox fires two extra focus events when the user first clicks into an iframe:
 	// first on the window, then on the document. We ignore these events so they don't
 	// cause keyboard focus rings to appear.
-	let ownerWindow = getOwnerWindow(getEventTarget(e) as Element);
-	let ownerDocument = getOwnerDocument(getEventTarget(e) as Element);
+	let ownerWindow = getOwnerWindow(getEventTarget(e));
+	let ownerDocument = getOwnerDocument(getEventTarget(e));
 	if (
 		getEventTarget(e) === ownerWindow ||
 		getEventTarget(e) === ownerDocument ||
@@ -352,7 +352,7 @@ const nonTextInputTypes = new Set([
  */
 function isKeyboardFocusEvent(isTextInput: boolean, modality: Modality, e: HandlerEvent) {
 	let eventTarget = e ? (getEventTarget(e) as Element) : undefined;
-	let document = getOwnerDocument(eventTarget);
+	let ownerDocument = getOwnerDocument(eventTarget);
 	let ownerWindow = getOwnerWindow(eventTarget);
 	const IHTMLInputElement =
 		typeof ownerWindow !== 'undefined' ? ownerWindow.HTMLInputElement : HTMLInputElement;
@@ -364,7 +364,7 @@ function isKeyboardFocusEvent(isTextInput: boolean, modality: Modality, e: Handl
 
 	// For keyboard events that occur on a non-input element that will move focus into input element (aka ArrowLeft going from Datepicker button to the main input group)
 	// we need to rely on the user passing isTextInput into here. This way we can skip toggling focus visiblity for said input element
-	let activeElement = getActiveElement(document);
+	let activeElement = getActiveElement(ownerDocument);
 	isTextInput =
 		isTextInput ||
 		(activeElement instanceof IHTMLInputElement && !nonTextInputTypes.has(activeElement.type)) ||

package/src/interactions/useKeyboard.ts

@@ -1,7 +1,13 @@
+import {
+	createKeyboardShortcutHandler,
+	type KeyboardShortcutBindings,
+} from './createKeyboardShortcutHandler';
+import { getEventTarget, nodeContains } from '../utils/shadowdom/DOMFunctions';
 // Ported from react-aria (source: .react-spectrum/packages/react-aria/src/interactions/useKeyboard.ts).
 // octane adaptations:
 // - `KeyboardEvents` / `DOMAttributes` from '@react-types/shared' are typed over React's
 //   synthetic events; local structural aliases over native KeyboardEvent replace them.
+// - Shortcut and user callbacks share the BaseEvent wrapper so both have propagation controls.
 // - Public-hook slot threading (splitSlot) per the binding convention; no octane base hooks
 //   are composed here, so the slot is absorbed and unused.
 import type { BaseEvent } from './createEventHandler';
@@ -20,6 +26,9 @@ export interface KeyboardEvents {
 export type DOMAttributes = Record<string, any>;
 
 export interface KeyboardProps extends KeyboardEvents {
+	shortcuts?: KeyboardShortcutBindings;
+	allowRepeats?: boolean;
+	allowComposing?: boolean;
 	/** Whether the keyboard events should be disabled. */
 	isDisabled?: boolean;
 }
@@ -39,12 +48,51 @@ export function useKeyboard(...args: any[]): KeyboardResult {
 	const [user] = splitSlot(args);
 	const props = user[0] as KeyboardProps;
 
+	let { shortcuts, allowRepeats = false, allowComposing = false } = props;
+	let onKeyDown;
+	let onKeyUp;
+	if (shortcuts) {
+		let shortcutHandler = createKeyboardShortcutHandler(shortcuts);
+		onKeyDown = createEventHandler<KeyboardEvent>((e) => {
+			props.onKeyDown?.(e);
+			// If keyboard event didn't originate from a child of the current target,
+			// then it's a React event coming through a portal. We should ignore it.
+			if (!nodeContains(e.currentTarget as Node, getEventTarget(e) as Element)) {
+				e.continuePropagation();
+				return;
+			}
+			if ((e.repeat && !allowRepeats) || (e.isComposing && !allowComposing)) {
+				e.continuePropagation();
+				return;
+			}
+
+			shortcutHandler(e);
+		});
+		onKeyUp = createEventHandler<KeyboardEvent>((e) => {
+			props.onKeyUp?.(e);
+			// If keyboard event didn't originate from a child of the current target,
+			// then it's a React event coming through a portal. We should ignore it.
+			if (!nodeContains(e.currentTarget as Node, getEventTarget(e) as Element)) {
+				e.continuePropagation();
+				return;
+			}
+			if ((e.repeat && !allowRepeats) || (e.isComposing && !allowComposing)) {
+				e.continuePropagation();
+				return;
+			}
+			// implement shortcut handler on keyup, what should the map be called? or should it be another syntax on shortcuts?
+			e.continuePropagation();
+		});
+	} else {
+		onKeyDown = createEventHandler(props.onKeyDown);
+		onKeyUp = createEventHandler(props.onKeyUp);
+	}
 	return {
 		keyboardProps: props.isDisabled
 			? {}
 			: {
-					onKeyDown: createEventHandler(props.onKeyDown),
-					onKeyUp: createEventHandler(props.onKeyUp),
+					onKeyDown,
+					onKeyUp,
 				},
 	};
 }

package/src/interactions/useLongPress.ts

@@ -4,7 +4,7 @@
 //   synthetic handlers); the `contextmenu` listener param carries an explicit native
 //   annotation (upstream got it contextually).
 // - Public-hook slot threading (splitSlot/subSlot) per the binding convention.
-import type { FocusableElement, LongPressEvent } from '@react-types/shared';
+import type { FocusableElement, LongPressEvent, PressEvent } from '@react-types/shared';
 import { focusWithoutScrolling } from '../utils/focusWithoutScrolling';
 import { getOwnerDocument, getOwnerWindow } from '../utils/domHelpers';
 import { mergeProps } from '../utils/mergeProps';
@@ -21,6 +21,8 @@ type DOMAttributes = Record<string, any>;
 export interface LongPressProps {
 	/** Whether long press events should be disabled. */
 	isDisabled?: boolean;
+	/** Which pointer type to listen for. By default, both mouse and touch are listened for. */
+	pointerType?: 'mouse' | 'touch';
 	/** Handler that is called when a long press interaction starts. */
 	onLongPressStart?: (e: LongPressEvent) => void;
 	/**
@@ -65,6 +67,7 @@ export function useLongPress(...args: any[]): LongPressResult {
 
 	let {
 		isDisabled,
+		pointerType,
 		onLongPressStart,
 		onLongPressEnd,
 		onLongPress,
@@ -76,14 +79,20 @@ export function useLongPress(...args: any[]): LongPressResult {
 		undefined,
 		subSlot(slot, 'timer'),
 	);
-	let { addGlobalListener, removeGlobalListener } = useGlobalListeners(subSlot(slot, 'listeners'));
+	let { addGlobalListener, removeAllGlobalListeners } = useGlobalListeners(
+		subSlot(slot, 'listeners'),
+	);
+	let isAcceptedPointerType = (e: PressEvent) =>
+		pointerType
+			? e.pointerType === pointerType
+			: e.pointerType === 'mouse' || e.pointerType === 'touch';
 
 	let { pressProps } = usePress(
 		{
 			isDisabled,
 			onPressStart(e) {
 				e.continuePropagation();
-				if (e.pointerType === 'mouse' || e.pointerType === 'touch') {
+				if (isAcceptedPointerType(e)) {
 					if (onLongPressStart) {
 						onLongPressStart({
 							...e,
@@ -95,6 +104,9 @@ export function useLongPress(...args: any[]): LongPressResult {
 						// Prevent other usePress handlers from also handling this event.
 						e.target.dispatchEvent(new PointerEvent('pointercancel', { bubbles: true }));
 
+						// Prevent default click action (e.g. opening a link) after a long press.
+						addGlobalListener(e.target, 'click', (e) => e.preventDefault(), { once: true });
+
 						// Ensure target is focused. On touch devices, browsers typically focus on pointer up.
 						if (getOwnerDocument(e.target).activeElement !== e.target) {
 							focusWithoutScrolling(e.target as FocusableElement);
@@ -111,25 +123,24 @@ export function useLongPress(...args: any[]): LongPressResult {
 
 					// Prevent context menu, which may be opened on long press on touch devices
 					if (e.pointerType === 'touch') {
-						let onContextMenu = (e: Event) => {
-							e.preventDefault();
-						};
-
-						let ownerWindow = getOwnerWindow(e.target);
-						addGlobalListener(e.target, 'contextmenu', onContextMenu, { once: true });
-						addGlobalListener(
-							ownerWindow,
-							'pointerup',
-							() => {
-								// If no contextmenu event is fired quickly after pointerup, remove the handler
-								// so future context menu events outside a long press are not prevented.
-								setTimeout(() => {
-									removeGlobalListener(e.target, 'contextmenu', onContextMenu);
-								}, 30);
-							},
-							{ once: true },
-						);
+						addGlobalListener(e.target, 'contextmenu', (e: Event) => e.preventDefault(), {
+							once: true,
+						});
 					}
+
+					let ownerWindow = getOwnerWindow(e.target);
+					addGlobalListener(
+						ownerWindow,
+						'pointerup',
+						() => {
+							// If no contextmenu event is fired quickly after pointerup, remove the handler
+							// so future context menu events outside a long press are not prevented.
+							setTimeout(() => {
+								removeAllGlobalListeners();
+							}, 100);
+						},
+						{ once: true },
+					);
 				}
 			},
 			onPressEnd(e) {
@@ -137,7 +148,7 @@ export function useLongPress(...args: any[]): LongPressResult {
 					clearTimeout(timeRef.current);
 				}
 
-				if (onLongPressEnd && (e.pointerType === 'mouse' || e.pointerType === 'touch')) {
+				if (onLongPressEnd && isAcceptedPointerType(e)) {
 					onLongPressEnd({
 						...e,
 						type: 'longpressend',

package/src/interactions/useMove.ts

@@ -130,7 +130,7 @@ export function useMove(...args: any[]): MoveResult {
 				let onMouseUp = (e: MouseEvent) => {
 					if (e.button === 0) {
 						endEvent(e, 'mouse');
-						let ownerWindow = getOwnerWindow(getEventTarget(e) as Element);
+						let ownerWindow = getOwnerWindow(getEventTarget(e));
 						removeGlobalListener(ownerWindow, 'mousemove', onMouseMove, false);
 						removeGlobalListener(ownerWindow, 'mouseup', onMouseUp, false);
 					}
@@ -141,7 +141,7 @@ export function useMove(...args: any[]): MoveResult {
 						e.stopPropagation();
 						e.preventDefault();
 						state.current.lastPosition = { pageX: e.pageX, pageY: e.pageY };
-						let ownerWindow = getOwnerWindow(getEventTarget(e) as Element);
+						let ownerWindow = getOwnerWindow(getEventTarget(e));
 						addGlobalListener(ownerWindow, 'mousemove', onMouseMove, false);
 						addGlobalListener(ownerWindow, 'mouseup', onMouseUp, false);
 					}
@@ -169,7 +169,7 @@ export function useMove(...args: any[]): MoveResult {
 					if (touch >= 0) {
 						endEvent(e, 'touch');
 						state.current.id = null;
-						let ownerWindow = getOwnerWindow(getEventTarget(e) as Element);
+						let ownerWindow = getOwnerWindow(getEventTarget(e));
 						removeGlobalListener(ownerWindow, 'touchmove', onTouchMove);
 						removeGlobalListener(ownerWindow, 'touchend', onTouchEnd);
 						removeGlobalListener(ownerWindow, 'touchcancel', onTouchEnd);
@@ -186,7 +186,7 @@ export function useMove(...args: any[]): MoveResult {
 					e.preventDefault();
 					state.current.lastPosition = { pageX, pageY };
 					state.current.id = identifier;
-					let ownerWindow = getOwnerWindow(getEventTarget(e) as Element);
+					let ownerWindow = getOwnerWindow(getEventTarget(e));
 					addGlobalListener(ownerWindow, 'touchmove', onTouchMove, false);
 					addGlobalListener(ownerWindow, 'touchend', onTouchEnd, false);
 					addGlobalListener(ownerWindow, 'touchcancel', onTouchEnd, false);
@@ -214,7 +214,7 @@ export function useMove(...args: any[]): MoveResult {
 						let pointerType = (e.pointerType || 'mouse') as PointerType;
 						endEvent(e, pointerType);
 						state.current.id = null;
-						let ownerWindow = getOwnerWindow(getEventTarget(e) as Element);
+						let ownerWindow = getOwnerWindow(getEventTarget(e));
 						removeGlobalListener(ownerWindow, 'pointermove', onPointerMove, false);
 						removeGlobalListener(ownerWindow, 'pointerup', onPointerUp, false);
 						removeGlobalListener(ownerWindow, 'pointercancel', onPointerUp, false);
@@ -228,7 +228,7 @@ export function useMove(...args: any[]): MoveResult {
 						e.preventDefault();
 						state.current.lastPosition = { pageX: e.pageX, pageY: e.pageY };
 						state.current.id = e.pointerId;
-						let ownerWindow = getOwnerWindow(getEventTarget(e) as Element);
+						let ownerWindow = getOwnerWindow(getEventTarget(e));
 						addGlobalListener(ownerWindow, 'pointermove', onPointerMove, false);
 						addGlobalListener(ownerWindow, 'pointerup', onPointerUp, false);
 						addGlobalListener(ownerWindow, 'pointercancel', onPointerUp, false);

package/src/interactions/usePress.ts

@@ -1222,7 +1222,15 @@ function shouldPreventDefaultUp(target: Element) {
 }
 
 function shouldPreventDefaultKeyboard(target: Element, key: string) {
+	if (isMac() && key === 'Enter') {
+		return false;
+	}
+
 	if (target instanceof HTMLInputElement) {
+		if (key === 'Enter' && (target.type === 'checkbox' || target.type === 'radio')) {
+			// Enter on a checkbox or radio should do an implicit form submission, but not toggle the input.
+			return false;
+		}
 		return !isValidInputKey(target, key);
 	}