Skip to content

Commit 6ba5fa9

Browse files
Saadnajmifacebook-github-bot
authored andcommitted
Update pressable hover props (#34740)
Summary: This is a mirror of DefinitelyTyped/DefinitelyTyped#62344 . I am updating some typescript types for props that were added with #32405 ## Changelog <!-- Help reviewers and the release process by writing your own changelog entry. For an example, see: https://reactnative.dev/contributing/changelogs-in-pull-requests --> [General] [Fixed] - Fixed missing Pressable hover props in typescript definition Pull Request resolved: #34740 Test Plan: Added a test case. Reviewed By: lunaleaps Differential Revision: D39688606 Pulled By: cortinico fbshipit-source-id: 98ea5f64e6ac264772466455e6d5ab99a8427d3a
1 parent eddff32 commit 6ba5fa9

File tree

2 files changed

+43
-2
lines changed

2 files changed

+43
-2
lines changed

types/__typetests__/index.tsx

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,7 @@ import {
6666
LogBox,
6767
MaskedViewIOS,
6868
Modal,
69+
MouseEvent,
6970
NativeEventEmitter,
7071
NativeModule, // Not actually exported, not sure why
7172
NativeModules,
@@ -496,6 +497,12 @@ export class PressableTest extends React.Component<{}> {
496497
e.isDefaultPrevented();
497498
};
498499

500+
onHoverButton = (e: MouseEvent) => {
501+
e.persist();
502+
e.isPropagationStopped();
503+
e.isDefaultPrevented();
504+
};
505+
499506
render() {
500507
return (
501508
<>
@@ -550,6 +557,15 @@ export class PressableTest extends React.Component<{}> {
550557
<Text style={{margin: 30}}>Button</Text>
551558
</View>
552559
</Pressable>
560+
{/* onHoverIn */}
561+
<Pressable
562+
ref={this.myRef}
563+
onHoverIn={this.onHoverButton}
564+
style={{backgroundColor: 'blue'}}>
565+
<View style={{width: 150, height: 100, backgroundColor: 'red'}}>
566+
<Text style={{margin: 30}}>Button</Text>
567+
</View>
568+
</Pressable>
553569
</>
554570
);
555571
}

types/index.d.ts

Lines changed: 27 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,7 @@
4949
// Zihan Chen <https://github.com/ZihanChen-MSFT>
5050
// Lorenzo Sciandra <https://github.com/kelset>
5151
// Mateusz Wit <https://github.com/MateWW>
52+
// Saad Najmi <https://github.com/saadnajmi>
5253
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
5354
// TypeScript Version: 3.0
5455

@@ -579,6 +580,8 @@ export type PointerEvent = NativeSyntheticEvent<NativePointerEvent>;
579580
export interface GestureResponderEvent
580581
extends NativeSyntheticEvent<NativeTouchEvent> {}
581582

583+
export interface MouseEvent extends NativeSyntheticEvent<NativeMouseEvent> {}
584+
582585
// See https://reactnative.dev/docs/scrollview#contentoffset
583586
export interface PointProp {
584587
x: number;
@@ -606,6 +609,16 @@ export interface PressableAndroidRippleConfig {
606609
export interface PressableProps
607610
extends AccessibilityProps,
608611
Omit<ViewProps, 'children' | 'style' | 'hitSlop'> {
612+
/**
613+
* Called when the hover is activated to provide visual feedback.
614+
*/
615+
onHoverIn?: null | ((event: MouseEvent) => void) | undefined;
616+
617+
/**
618+
* Called when the hover is deactivated to undo visual feedback.
619+
*/
620+
onHoverOut?: null | ((event: MouseEvent) => void) | undefined;
621+
609622
/**
610623
* Called when a single tap gesture is detected.
611624
*/
@@ -628,7 +641,7 @@ export interface PressableProps
628641

629642
/**
630643
* Called after the element loses focus.
631-
* @platform windows
644+
* @platform macos windows
632645
*/
633646
onBlur?:
634647
| null
@@ -637,7 +650,7 @@ export interface PressableProps
637650

638651
/**
639652
* Called after the element is focused.
640-
* @platform windows
653+
* @platform macos windows
641654
*/
642655
onFocus?:
643656
| null
@@ -659,6 +672,18 @@ export interface PressableProps
659672
*/
660673
cancelable?: null | boolean | undefined;
661674

675+
/**
676+
* Duration to wait after hover in before calling `onHoverIn`.
677+
* @platform macos windows
678+
*/
679+
delayHoverIn?: number | null | undefined;
680+
681+
/**
682+
* Duration to wait after hover out before calling `onHoverOut`.
683+
* @platform macos windows
684+
*/
685+
delayHoverOut?: number | null | undefined;
686+
662687
/**
663688
* Duration (in milliseconds) from `onPressIn` before `onLongPress` is called.
664689
*/

0 commit comments

Comments
 (0)