@octanejs/aria 0.0.46 → 0.0.48

package/src/menu/useMenuTrigger.ts

@@ -1,189 +0,0 @@
-// Ported from react-aria (source: .react-spectrum/packages/react-aria/src/menu/useMenuTrigger.ts).
-// octane adaptations:
-// - `useOverlayTrigger` comes from the freshly-ported overlays glue
-//   (src/overlays/useOverlayTrigger.ts) — the rest of the overlays area (positioning,
-//   modal machinery) remains unported.
-// - The trigger `onKeyDown` receives either the NATIVE KeyboardEvent (when spread straight
-//   onto an element) or the ported BaseEvent Proxy wrapper (when routed through
-//   useButton/useKeyboard). Upstream detects the wrapper with `'continuePropagation' in e`;
-//   the ported wrapper is a Proxy with only a `get` trap, so detection uses
-//   `typeof e.continuePropagation === 'function'` (the same probe createEventHandler uses
-//   for nested wrappers). Upstream's synthetic `e.isDefaultPrevented()` becomes the native
-//   `e.defaultPrevented`.
-// - The Parcel glob intl import becomes the generated '../intl/menu' dictionary index.
-// - Public-hook slot threading (splitSlot/subSlot) per the binding convention.
-import type { AriaButtonProps } from '../button/useButton';
-import type { AriaMenuOptions } from './useMenu';
-import type { FocusableElement, RefObject } from '@react-types/shared';
-import { focusWithoutScrolling } from '../utils/focusWithoutScrolling';
-import intlMessages from '../intl/menu';
-import type { MenuTriggerState, MenuTriggerType } from '../stately/menu/useMenuTriggerState';
-import type { PressProps } from '../interactions/usePress';
-import { useId } from '../utils/useId';
-import { useLocalizedStringFormatter } from '../i18n/useLocalizedStringFormatter';
-import { useLongPress } from '../interactions/useLongPress';
-import { useOverlayTrigger } from '../overlays/useOverlayTrigger';
-
-import { S, splitSlot, subSlot } from '../internal';
-
-export interface AriaMenuTriggerProps {
-	/** The type of menu that the menu trigger opens. */
-	type?: 'menu' | 'listbox';
-	/** Whether menu trigger is disabled. */
-	isDisabled?: boolean;
-	/** How menu is triggered. */
-	trigger?: MenuTriggerType;
-}
-
-export interface MenuTriggerAria<T> {
-	/** Props for the menu trigger element. */
-	menuTriggerProps: AriaButtonProps;
-
-	/** Props for the menu. */
-	menuProps: AriaMenuOptions<T>;
-}
-
-/**
- * Provides the behavior and accessibility implementation for a menu trigger.
- *
- * @param props - Props for the menu trigger.
- * @param state - State for the menu trigger.
- * @param ref - Ref to the HTML element trigger for the menu.
- */
-export function useMenuTrigger<T>(
-	props: AriaMenuTriggerProps,
-	state: MenuTriggerState,
-	ref: RefObject<Element | null>,
-): MenuTriggerAria<T>;
-// Slot-threading form: sibling ported hooks pass their derived sub-slot as the trailing arg.
-export function useMenuTrigger<T>(
-	props: AriaMenuTriggerProps,
-	state: MenuTriggerState,
-	ref: RefObject<Element | null>,
-	slot: symbol | undefined,
-): MenuTriggerAria<T>;
-export function useMenuTrigger(...args: any[]): MenuTriggerAria<any> {
-	const [user, slotArg] = splitSlot(args);
-	const slot = slotArg ?? S('useMenuTrigger');
-	const props = user[0] as AriaMenuTriggerProps;
-	const state = user[1] as MenuTriggerState;
-	const ref = user[2] as RefObject<Element | null>;
-
-	let { type = 'menu', isDisabled, trigger = 'press' } = props;
-
-	let menuTriggerId = useId(subSlot(slot, 'triggerId'));
-	let { triggerProps, overlayProps } = useOverlayTrigger(
-		{ type },
-		state,
-		ref,
-		subSlot(slot, 'overlayTrigger'),
-	);
-
-	let onKeyDown = (e: any) => {
-		if (isDisabled) {
-			return;
-		}
-
-		if (trigger === 'longPress' && !e.altKey) {
-			return;
-		}
-
-		if (ref && ref.current) {
-			switch (e.key) {
-				case 'Enter':
-				case ' ':
-					// React puts listeners on the same root, so even if propagation was stopped, immediate propagation is still possible.
-					// useTypeSelect will handle the spacebar first if it's running, so we don't want to open if it's handled it already.
-					// We use isDefaultPrevented() instead of isPropagationStopped() because createEventHandler stops propagation by default.
-					// And default prevented means that the event was handled by something else (typeahead), so we don't want to open the menu.
-					// octane adaptation: the native `defaultPrevented` flag (forwarded by the
-					// BaseEvent Proxy wrapper) replaces the synthetic isDefaultPrevented().
-					if (trigger === 'longPress' || e.defaultPrevented) {
-						return;
-					}
-				// fallthrough
-				case 'ArrowDown':
-					// Stop propagation, unless it would already be handled by useKeyboard.
-					if (typeof e.continuePropagation !== 'function') {
-						e.stopPropagation();
-					}
-					e.preventDefault();
-					state.toggle('first');
-					break;
-				case 'ArrowUp':
-					if (typeof e.continuePropagation !== 'function') {
-						e.stopPropagation();
-					}
-					e.preventDefault();
-					state.toggle('last');
-					break;
-				default:
-					// Allow other keys.
-					if (typeof e.continuePropagation === 'function') {
-						e.continuePropagation();
-					}
-			}
-		}
-	};
-
-	let stringFormatter = useLocalizedStringFormatter(
-		intlMessages,
-		'@react-aria/menu',
-		subSlot(slot, 'formatter'),
-	);
-	let { longPressProps } = useLongPress(
-		{
-			isDisabled: isDisabled || trigger !== 'longPress',
-			accessibilityDescription: stringFormatter.format('longPressMessage'),
-			onLongPressStart() {
-				state.close();
-			},
-			onLongPress() {
-				state.open('first');
-			},
-		},
-		subSlot(slot, 'longPress'),
-	);
-
-	let pressProps: PressProps = {
-		preventFocusOnPress: true,
-		onPressStart(e) {
-			// For consistency with native, open the menu on mouse/key down, but touch up.
-			if (e.pointerType !== 'touch' && e.pointerType !== 'keyboard' && !isDisabled) {
-				// Ensure trigger has focus before opening the menu so it can be restored by FocusScope on close.
-				focusWithoutScrolling(e.target as FocusableElement);
-
-				// If opened with a screen reader, auto focus the first item.
-				// Otherwise, the menu itself will be focused.
-				state.open(e.pointerType === 'virtual' ? 'first' : null);
-			}
-		},
-		onPress(e) {
-			if (e.pointerType === 'touch' && !isDisabled) {
-				// Ensure trigger has focus before opening the menu so it can be restored by FocusScope on close.
-				focusWithoutScrolling(e.target as FocusableElement);
-
-				state.toggle();
-			}
-		},
-	};
-
-	// omit onPress from triggerProps since we override it above.
-	delete triggerProps.onPress;
-
-	return {
-		// @ts-ignore - TODO we pass out both DOMAttributes AND AriaButtonProps, but useButton will discard the longPress event handlers, it's only through PressResponder magic that this works for RSP and RAC. it does not work in aria examples
-		menuTriggerProps: {
-			...triggerProps,
-			...(trigger === 'press' ? pressProps : longPressProps),
-			id: menuTriggerId,
-			onKeyDown,
-		},
-		menuProps: {
-			...overlayProps,
-			'aria-labelledby': menuTriggerId,
-			autoFocus: state.focusStrategy || true,
-			onClose: state.close,
-		},
-	};
-}

package/src/searchfield/useSearchField.ts

@@ -1,156 +0,0 @@
-// Ported from react-aria (source: .react-spectrum/packages/react-aria/src/searchfield/useSearchField.ts).
-// octane adaptations: the Parcel glob intl import becomes the generated
-// src/intl/searchfield index (verbatim dictionaries); per-element attribute types →
-// structural bags; the keydown handler receives the wrapped BaseEvent from the ported
-// useKeyboard (so `continuePropagation()` works); public-hook slot threading.
-import type { RefObject, ValidationResult } from '@react-types/shared';
-
-import type { AriaButtonProps } from '../button/useButton';
-import { AriaTextFieldProps, useTextField } from '../textfield/useTextField';
-import { S, splitSlot, subSlot } from '../internal';
-import { chain } from '../utils/chain';
-import intlMessages from '../intl/searchfield';
-import type {
-	SearchFieldProps,
-	SearchFieldState,
-} from '../stately/searchfield/useSearchFieldState';
-import { useLocalizedStringFormatter } from '../i18n/useLocalizedStringFormatter';
-
-type DOMAttributes = Record<string, any>;
-
-export interface AriaSearchFieldProps extends SearchFieldProps, Omit<AriaTextFieldProps, 'type'> {
-	/**
-	 * An enumerated attribute that defines what action label or icon to preset for the enter key on
-	 * virtual keyboards. See
-	 * [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/enterkeyhint).
-	 */
-	enterKeyHint?: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
-	/**
-	 * The type of input to render. See
-	 * [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdeftype).
-	 *
-	 * @default 'search'
-	 */
-	type?: 'text' | 'search' | 'url' | 'tel' | 'email' | 'password' | (string & {});
-}
-
-export interface SearchFieldAria extends ValidationResult {
-	/** Props for the text field's visible label element (if any). */
-	labelProps: DOMAttributes;
-	/** Props for the input element. */
-	inputProps: DOMAttributes;
-	/** Props for the clear button. */
-	clearButtonProps: AriaButtonProps;
-	/** Props for the searchfield's description element, if any. */
-	descriptionProps: DOMAttributes;
-	/** Props for the searchfield's error message element, if any. */
-	errorMessageProps: DOMAttributes;
-}
-
-/**
- * Provides the behavior and accessibility implementation for a search field.
- */
-export function useSearchField(
-	props: AriaSearchFieldProps,
-	state: SearchFieldState,
-	inputRef: RefObject<HTMLInputElement | null>,
-): SearchFieldAria;
-// Slot-threading form: sibling ported hooks pass their derived sub-slot as the trailing arg.
-export function useSearchField(
-	props: AriaSearchFieldProps,
-	state: SearchFieldState,
-	inputRef: RefObject<HTMLInputElement | null>,
-	slot: symbol | undefined,
-): SearchFieldAria;
-export function useSearchField(...args: any[]): SearchFieldAria {
-	const [user, slotArg] = splitSlot(args);
-	const slot = slotArg ?? S('useSearchField');
-	const props = user[0] as AriaSearchFieldProps;
-	const state = user[1] as SearchFieldState;
-	const inputRef = user[2] as RefObject<HTMLInputElement | null>;
-
-	let stringFormatter = useLocalizedStringFormatter(
-		intlMessages,
-		'@react-aria/searchfield',
-		subSlot(slot, 'strings'),
-	);
-	let { isDisabled, isReadOnly, onSubmit, onClear, type = 'search' } = props;
-	let onKeyDown = (e: any) => {
-		const key = e.key;
-
-		if (key === 'Enter' && (isDisabled || isReadOnly)) {
-			e.preventDefault();
-		}
-
-		if (isDisabled || isReadOnly) {
-			return;
-		}
-
-		// for backward compatibility;
-		// otherwise, "Enter" on an input would trigger a form submit, the default browser behavior
-		if (key === 'Enter' && onSubmit) {
-			e.preventDefault();
-			onSubmit(state.value);
-		}
-
-		if (key === 'Escape') {
-			// Also check the inputRef value for the case where the value was set directly on the input element instead of going through
-			// the hook
-			if (state.value === '' && (!inputRef.current || inputRef.current.value === '')) {
-				e.continuePropagation();
-			} else {
-				e.preventDefault();
-				state.setValue('');
-				if (onClear) {
-					onClear();
-				}
-			}
-		}
-	};
-
-	let onClearButtonClick = () => {
-		state.setValue('');
-
-		if (onClear) {
-			onClear();
-		}
-	};
-
-	let onPressStart = () => {
-		// this is in PressStart for mobile so that touching the clear button doesn't remove focus from
-		// the input and close the keyboard
-		inputRef.current?.focus();
-	};
-
-	let { labelProps, inputProps, descriptionProps, errorMessageProps, ...validation } = useTextField(
-		{
-			...props,
-			value: state.value,
-			onChange: state.setValue,
-			onKeyDown: !isReadOnly ? chain(onKeyDown, props.onKeyDown) : props.onKeyDown,
-			type,
-		} as any,
-		inputRef,
-		subSlot(slot, 'textField'),
-	);
-
-	return {
-		labelProps,
-		inputProps: {
-			...inputProps,
-			// already handled by useSearchFieldState
-			defaultValue: undefined,
-		},
-		clearButtonProps: {
-			'aria-label': stringFormatter.format('Clear search'),
-			excludeFromTabOrder: true,
-			preventFocusOnPress: true,
-			isDisabled: isDisabled || isReadOnly,
-			onPress: onClearButtonClick,
-			onPressStart,
-		},
-		descriptionProps,
-		errorMessageProps,
-		...validation,
-	};
-}