1 | import { DOMAttributes, PressEvents, FocusableElement, FocusEvents, HoverEvents, KeyboardEvents, MoveEvents, ScrollEvents, LongPressEvent } from "@react-types/shared";
|
2 | import React, { RefObject, ReactElement, ReactNode, FocusEvent, SyntheticEvent } from "react";
|
3 | export interface PressProps extends PressEvents {
|
4 | /** Whether the target is in a controlled press state (e.g. an overlay it triggers is open). */
|
5 | isPressed?: boolean;
|
6 | /** Whether the press events should be disabled. */
|
7 | isDisabled?: boolean;
|
8 | /** Whether the target should not receive focus on press. */
|
9 | preventFocusOnPress?: boolean;
|
10 | /**
|
11 | * Whether press events should be canceled when the pointer leaves the target while pressed.
|
12 | * By default, this is `false`, which means if the pointer returns back over the target while
|
13 | * still pressed, onPressStart will be fired again. If set to `true`, the press is canceled
|
14 | * when the pointer leaves the target and onPressStart will not be fired if the pointer returns.
|
15 | */
|
16 | shouldCancelOnPointerExit?: boolean;
|
17 | /** Whether text selection should be enabled on the pressable element. */
|
18 | allowTextSelectionOnPress?: boolean;
|
19 | }
|
20 | export interface PressHookProps extends PressProps {
|
21 | /** A ref to the target element. */
|
22 | ref?: RefObject<Element>;
|
23 | }
|
24 | export interface PressResult {
|
25 | /** Whether the target is currently pressed. */
|
26 | isPressed: boolean;
|
27 | /** Props to spread on the target element. */
|
28 | pressProps: DOMAttributes;
|
29 | }
|
30 | /**
|
31 | * Handles press interactions across mouse, touch, keyboard, and screen readers.
|
32 | * It normalizes behavior across browsers and platforms, and handles many nuances
|
33 | * of dealing with pointer and keyboard events.
|
34 | */
|
35 | export function usePress(props: PressHookProps): PressResult;
|
36 | interface PressableProps extends PressProps {
|
37 | children: ReactElement<DOMAttributes, string>;
|
38 | }
|
39 | export const Pressable: React.ForwardRefExoticComponent<PressableProps & React.RefAttributes<Element>>;
|
40 | interface PressResponderProps extends PressProps {
|
41 | children: ReactNode;
|
42 | }
|
43 | export const PressResponder: React.ForwardRefExoticComponent<PressResponderProps & React.RefAttributes<FocusableElement>>;
|
44 | export interface FocusProps<Target = FocusableElement> extends FocusEvents<Target> {
|
45 | /** Whether the focus events should be disabled. */
|
46 | isDisabled?: boolean;
|
47 | }
|
48 | export interface FocusResult<Target = FocusableElement> {
|
49 | /** Props to spread onto the target element. */
|
50 | focusProps: DOMAttributes<Target>;
|
51 | }
|
52 | /**
|
53 | * Handles focus events for the immediate target.
|
54 | * Focus events on child elements will be ignored.
|
55 | */
|
56 | export function useFocus<Target extends FocusableElement = FocusableElement>(props: FocusProps<Target>): FocusResult<Target>;
|
57 | export type Modality = 'keyboard' | 'pointer' | 'virtual';
|
58 | export type FocusVisibleHandler = (isFocusVisible: boolean) => void;
|
59 | export interface FocusVisibleProps {
|
60 | /** Whether the element is a text input. */
|
61 | isTextInput?: boolean;
|
62 | /** Whether the element will be auto focused. */
|
63 | autoFocus?: boolean;
|
64 | }
|
65 | export interface FocusVisibleResult {
|
66 | /** Whether keyboard focus is visible globally. */
|
67 | isFocusVisible: boolean;
|
68 | }
|
69 | /**
|
70 | * If true, keyboard focus is visible.
|
71 | */
|
72 | export function isFocusVisible(): boolean;
|
73 | export function getInteractionModality(): Modality;
|
74 | export function setInteractionModality(modality: Modality): void;
|
75 | /**
|
76 | * Keeps state of the current modality.
|
77 | */
|
78 | export function useInteractionModality(): Modality;
|
79 | /**
|
80 | * Manages focus visible state for the page, and subscribes individual components for updates.
|
81 | */
|
82 | export function useFocusVisible(props?: FocusVisibleProps): FocusVisibleResult;
|
83 | /**
|
84 | * Listens for trigger change and reports if focus is visible (i.e., modality is not pointer).
|
85 | */
|
86 | export function useFocusVisibleListener(fn: FocusVisibleHandler, deps: ReadonlyArray<any>, opts?: {
|
87 | isTextInput?: boolean;
|
88 | }): void;
|
89 | export interface FocusWithinProps {
|
90 | /** Whether the focus within events should be disabled. */
|
91 | isDisabled?: boolean;
|
92 | /** Handler that is called when the target element or a descendant receives focus. */
|
93 | onFocusWithin?: (e: FocusEvent) => void;
|
94 | /** Handler that is called when the target element and all descendants lose focus. */
|
95 | onBlurWithin?: (e: FocusEvent) => void;
|
96 | /** Handler that is called when the the focus within state changes. */
|
97 | onFocusWithinChange?: (isFocusWithin: boolean) => void;
|
98 | }
|
99 | export interface FocusWithinResult {
|
100 | /** Props to spread onto the target element. */
|
101 | focusWithinProps: DOMAttributes;
|
102 | }
|
103 | /**
|
104 | * Handles focus events for the target and its descendants.
|
105 | */
|
106 | export function useFocusWithin(props: FocusWithinProps): FocusWithinResult;
|
107 | export interface HoverProps extends HoverEvents {
|
108 | /** Whether the hover events should be disabled. */
|
109 | isDisabled?: boolean;
|
110 | }
|
111 | export interface HoverResult {
|
112 | /** Props to spread on the target element. */
|
113 | hoverProps: DOMAttributes;
|
114 | isHovered: boolean;
|
115 | }
|
116 | /**
|
117 | * Handles pointer hover interactions for an element. Normalizes behavior
|
118 | * across browsers and platforms, and ignores emulated mouse events on touch devices.
|
119 | */
|
120 | export function useHover(props: HoverProps): HoverResult;
|
121 | export interface InteractOutsideProps {
|
122 | ref: RefObject<Element>;
|
123 | onInteractOutside?: (e: SyntheticEvent) => void;
|
124 | onInteractOutsideStart?: (e: SyntheticEvent) => void;
|
125 | /** Whether the interact outside events should be disabled. */
|
126 | isDisabled?: boolean;
|
127 | }
|
128 | /**
|
129 | * Example, used in components like Dialogs and Popovers so they can close
|
130 | * when a user clicks outside them.
|
131 | */
|
132 | export function useInteractOutside(props: InteractOutsideProps): void;
|
133 | export interface KeyboardProps extends KeyboardEvents {
|
134 | /** Whether the keyboard events should be disabled. */
|
135 | isDisabled?: boolean;
|
136 | }
|
137 | export interface KeyboardResult {
|
138 | /** Props to spread onto the target element. */
|
139 | keyboardProps: DOMAttributes;
|
140 | }
|
141 | /**
|
142 | * Handles keyboard interactions for a focusable element.
|
143 | */
|
144 | export function useKeyboard(props: KeyboardProps): KeyboardResult;
|
145 | export interface MoveResult {
|
146 | /** Props to spread on the target element. */
|
147 | moveProps: DOMAttributes;
|
148 | }
|
149 | /**
|
150 | * Handles move interactions across mouse, touch, and keyboard, including dragging with
|
151 | * the mouse or touch, and using the arrow keys. Normalizes behavior across browsers and
|
152 | * platforms, and ignores emulated mouse events on touch devices.
|
153 | */
|
154 | export function useMove(props: MoveEvents): MoveResult;
|
155 | export interface ScrollWheelProps extends ScrollEvents {
|
156 | /** Whether the scroll listener should be disabled. */
|
157 | isDisabled?: boolean;
|
158 | }
|
159 | export function useScrollWheel(props: ScrollWheelProps, ref: RefObject<HTMLElement>): void;
|
160 | export interface LongPressProps {
|
161 | /** Whether long press events should be disabled. */
|
162 | isDisabled?: boolean;
|
163 | /** Handler that is called when a long press interaction starts. */
|
164 | onLongPressStart?: (e: LongPressEvent) => void;
|
165 | /**
|
166 | * Handler that is called when a long press interaction ends, either
|
167 | * over the target or when the pointer leaves the target.
|
168 | */
|
169 | onLongPressEnd?: (e: LongPressEvent) => void;
|
170 | /**
|
171 | * Handler that is called when the threshold time is met while
|
172 | * the press is over the target.
|
173 | */
|
174 | onLongPress?: (e: LongPressEvent) => void;
|
175 | /**
|
176 | * The amount of time in milliseconds to wait before triggering a long press.
|
177 | * @default 500ms
|
178 | */
|
179 | threshold?: number;
|
180 | /**
|
181 | * A description for assistive techology users indicating that a long press
|
182 | * action is available, e.g. "Long press to open menu".
|
183 | */
|
184 | accessibilityDescription?: string;
|
185 | }
|
186 | export interface LongPressResult {
|
187 | /** Props to spread on the target element. */
|
188 | longPressProps: DOMAttributes;
|
189 | }
|
190 | /**
|
191 | * Handles long press interactions across mouse and touch devices. Supports a customizable time threshold,
|
192 | * accessibility description, and normalizes behavior across browsers and devices.
|
193 | */
|
194 | export function useLongPress(props: LongPressProps): LongPressResult;
|
195 | export type { MoveEvents } from '@react-types/shared';
|
196 |
|
197 | //# sourceMappingURL=types.d.ts.map
|