diff --git a/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenu.js b/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenu.js index 467a6eaa15ea5..a3742787da981 100644 --- a/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenu.js +++ b/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenu.js @@ -14,6 +14,8 @@ import {RegistryContext} from './Contexts'; import styles from './ContextMenu.css'; +import type {RegistryContextType} from './Contexts'; + function respositionToFit(element: HTMLElement, pageX: number, pageY: number) { const ownerWindow = element.ownerDocument.defaultView; if (element !== null) { @@ -52,7 +54,7 @@ type Props = {| |}; export default function ContextMenu({children, id}: Props) { - const {registerMenu} = useContext(RegistryContext); + const {registerMenu} = useContext(RegistryContext); const [state, setState] = useState(HIDDEN_STATE); @@ -61,12 +63,15 @@ export default function ContextMenu({children, id}: Props) { const menuRef = useRef(null); useEffect(() => { - const ownerDocument = bodyAccessorRef.current.ownerDocument; - containerRef.current = ownerDocument.createElement('div'); - ownerDocument.body.appendChild(containerRef.current); - return () => { - ownerDocument.body.removeChild(containerRef.current); - }; + const element = bodyAccessorRef.current; + if (element !== null) { + const ownerDocument = element.ownerDocument; + containerRef.current = ownerDocument.createElement('div'); + ownerDocument.body.appendChild(containerRef.current); + return () => { + ownerDocument.body.removeChild(containerRef.current); + }; + } }, []); useEffect(() => { @@ -82,45 +87,52 @@ export default function ContextMenu({children, id}: Props) { return; } - const menu = menuRef.current; + const menu = ((menuRef.current: any): HTMLElement); + const container = containerRef.current; + if (container !== null) { + const hideUnlessContains = event => { + if (!menu.contains(event.target)) { + setState(HIDDEN_STATE); + } + }; - const hideUnlessContains = event => { - if (!menu.contains(event.target)) { + const hide = event => { setState(HIDDEN_STATE); - } - }; + }; - const hide = event => { - setState(HIDDEN_STATE); - }; + const ownerDocument = container.ownerDocument; + ownerDocument.addEventListener('mousedown', hideUnlessContains); + ownerDocument.addEventListener('touchstart', hideUnlessContains); + ownerDocument.addEventListener('keydown', hideUnlessContains); - const ownerDocument = containerRef.current.ownerDocument; - ownerDocument.addEventListener('mousedown', hideUnlessContains); - ownerDocument.addEventListener('touchstart', hideUnlessContains); - ownerDocument.addEventListener('keydown', hideUnlessContains); + const ownerWindow = ownerDocument.defaultView; + ownerWindow.addEventListener('resize', hide); - const ownerWindow = ownerDocument.defaultView; - ownerWindow.addEventListener('resize', hide); + respositionToFit(menu, state.pageX, state.pageY); - respositionToFit(menu, state.pageX, state.pageY); + return () => { + ownerDocument.removeEventListener('mousedown', hideUnlessContains); + ownerDocument.removeEventListener('touchstart', hideUnlessContains); + ownerDocument.removeEventListener('keydown', hideUnlessContains); - return () => { - ownerDocument.removeEventListener('mousedown', hideUnlessContains); - ownerDocument.removeEventListener('touchstart', hideUnlessContains); - ownerDocument.removeEventListener('keydown', hideUnlessContains); - - ownerWindow.removeEventListener('resize', hide); - }; + ownerWindow.removeEventListener('resize', hide); + }; + } }, [state]); if (!state.isVisible) { return
; } else { - return createPortal( -
- {children(state.data)} -
, - containerRef.current, - ); + const container = containerRef.current; + if (container !== null) { + return createPortal( +
+ {children(state.data)} +
, + container, + ); + } else { + return null; + } } } diff --git a/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.js b/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.js index 1b8ebb7cdcb75..f56bad1110b85 100644 --- a/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.js +++ b/packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.js @@ -13,6 +13,8 @@ import {RegistryContext} from './Contexts'; import styles from './ContextMenuItem.css'; +import type {RegistryContextType} from './Contexts'; + type Props = {| children: React$Node, onClick: () => void, @@ -20,7 +22,7 @@ type Props = {| |}; export default function ContextMenuItem({children, onClick, title}: Props) { - const {hideMenu} = useContext(RegistryContext); + const {hideMenu} = useContext(RegistryContext); const handleClick = event => { onClick(); diff --git a/packages/react-devtools-shared/src/devtools/ContextMenu/Contexts.js b/packages/react-devtools-shared/src/devtools/ContextMenu/Contexts.js index 9cf99a3d6adaf..0d2e55106c89f 100644 --- a/packages/react-devtools-shared/src/devtools/ContextMenu/Contexts.js +++ b/packages/react-devtools-shared/src/devtools/ContextMenu/Contexts.js @@ -55,7 +55,18 @@ function registerMenu(id: string, showFn: ShowFn, hideFn: HideFn) { }; } -export const RegistryContext = createContext({ +export type RegistryContextType = {| + hideMenu: () => void, + showMenu: ({| + data: Object, + id: string, + pageX: number, + pageY: number, + |}) => void, + registerMenu: (string, ShowFn, HideFn) => Function, +|}; + +export const RegistryContext = createContext({ hideMenu, showMenu, registerMenu, diff --git a/packages/react-devtools-shared/src/devtools/ContextMenu/useContextMenu.js b/packages/react-devtools-shared/src/devtools/ContextMenu/useContextMenu.js index 3829a4377ee34..1c713bae73dd5 100644 --- a/packages/react-devtools-shared/src/devtools/ContextMenu/useContextMenu.js +++ b/packages/react-devtools-shared/src/devtools/ContextMenu/useContextMenu.js @@ -10,6 +10,7 @@ import {useContext, useEffect} from 'react'; import {RegistryContext} from './Contexts'; +import type {RegistryContextType} from './Contexts'; import type {ElementRef} from 'react'; export default function useContextMenu({ @@ -21,7 +22,7 @@ export default function useContextMenu({ id: string, ref: {current: ElementRef<'div'> | null}, |}) { - const {showMenu} = useContext(RegistryContext); + const {showMenu} = useContext(RegistryContext); useEffect(() => { if (ref.current !== null) { @@ -30,11 +31,11 @@ export default function useContextMenu({ event.stopPropagation(); const pageX = - event.pageX || - (event.touches && ((event: any): TouchEvent).touches[0].pageX); + (event: any).pageX || + (event.touches && (event: any).touches[0].pageX); const pageY = - event.pageY || - (event.touches && ((event: any): TouchEvent).touches[0].pageY); + (event: any).pageY || + (event.touches && (event: any).touches[0].pageY); showMenu({data, id, pageX, pageY}); }; diff --git a/packages/react-devtools-shared/src/devtools/views/Components/Components.js b/packages/react-devtools-shared/src/devtools/views/Components/Components.js index 9e666548b6dd3..23d4888bf7a61 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/Components.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/Components.js @@ -32,11 +32,30 @@ import {NativeStyleContextController} from './NativeStyleEditor/context'; import styles from './Components.css'; +type Orientation = 'horizontal' | 'vertical'; + +type ResizeActionType = + | 'ACTION_SET_DID_MOUNT' + | 'ACTION_SET_IS_RESIZING' + | 'ACTION_SET_HORIZONTAL_PERCENTAGE' + | 'ACTION_SET_VERTICAL_PERCENTAGE'; + +type ResizeAction = {| + type: ResizeActionType, + payload: any, +|}; + +type ResizeState = {| + horizontalPercentage: number, + isResizing: boolean, + verticalPercentage: number, +|}; + function Components(_: {||}) { - const wrapperElementRef = useRef(null); - const resizeElementRef = useRef(null); + const wrapperElementRef = useRef(null); + const resizeElementRef = useRef(null); - const [state, dispatch] = useReducer( + const [state, dispatch] = useReducer( resizeReducer, null, initResizeState, @@ -171,25 +190,6 @@ const LOCAL_STORAGE_KEY = 'React::DevTools::createResizeReducer'; const VERTICAL_MODE_MAX_WIDTH = 600; const MINIMUM_SIZE = 50; -type Orientation = 'horizontal' | 'vertical'; - -type ResizeActionType = - | 'ACTION_SET_DID_MOUNT' - | 'ACTION_SET_IS_RESIZING' - | 'ACTION_SET_HORIZONTAL_PERCENTAGE' - | 'ACTION_SET_VERTICAL_PERCENTAGE'; - -type ResizeAction = {| - type: ResizeActionType, - payload: any, -|}; - -type ResizeState = {| - horizontalPercentage: number, - isResizing: boolean, - verticalPercentage: number, -|}; - function initResizeState(): ResizeState { let horizontalPercentage = 0.65; let verticalPercentage = 0.5; diff --git a/packages/react-devtools-shared/src/devtools/views/Components/EditableName.js b/packages/react-devtools-shared/src/devtools/views/Components/EditableName.js index e73f725407839..318596b644a9c 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/EditableName.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/EditableName.js @@ -12,7 +12,7 @@ import {useCallback, useState} from 'react'; import AutoSizeInput from './NativeStyleEditor/AutoSizeInput'; import styles from './EditableName.css'; -type OverrideNameFn = (path: Array, value: any) => void; +type OverrideNameFn = (name: string, value: any) => void; type EditableNameProps = {| autoFocus?: boolean, diff --git a/packages/react-devtools-shared/src/devtools/views/Components/HooksTree.js b/packages/react-devtools-shared/src/devtools/views/Components/HooksTree.js index 1c710c5e7c859..f055d207e9066 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/HooksTree.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/HooksTree.js @@ -241,7 +241,7 @@ function HookView({canEditHooks, hook, id, inspectPath, path}: HookViewProps) { } else { let overrideValueFn = null; // TODO Maybe read editable value from debug hook? - if (canEditHooks && isStateEditable) { + if (canEditHooks && isStateEditable && hookID !== null) { overrideValueFn = ( absolutePath: Array, newValue: any, diff --git a/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementContext.js b/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementContext.js index 5d3ae1f74f201..454d574a79ece 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementContext.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/InspectedElementContext.js @@ -51,14 +51,16 @@ export type GetInspectedElement = ( id: number, ) => InspectedElementFrontend | null; -type Context = {| +export type InspectedElementContextType = {| copyInspectedElementPath: CopyInspectedElementPath, getInspectedElementPath: GetInspectedElementPath, getInspectedElement: GetInspectedElement, storeAsGlobal: StoreAsGlobal, |}; -const InspectedElementContext = createContext(((null: any): Context)); +const InspectedElementContext = createContext( + ((null: any): InspectedElementContextType), +); InspectedElementContext.displayName = 'InspectedElementContext'; type ResolveFn = (inspectedElement: InspectedElementFrontend) => void; diff --git a/packages/react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/context.js b/packages/react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/context.js index 52e22fe23c974..029909f3134d1 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/context.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/context.js @@ -24,6 +24,9 @@ import { } from 'react-devtools-shared/src/devtools/views/context'; import {TreeStateContext} from '../TreeContext'; +import type {StateContext} from '../TreeContext'; +import type {FrontendBridge} from 'react-devtools-shared/src/bridge'; +import type Store from 'react-devtools-shared/src/devtools/store'; import type {StyleAndLayout as StyleAndLayoutBackend} from 'react-devtools-shared/src/backend/NativeStyleEditor/types'; import type {StyleAndLayout as StyleAndLayoutFrontend} from './types'; import type {Element} from 'react-devtools-shared/src/devtools/views/Components/types'; @@ -77,8 +80,8 @@ type Props = {| |}; function NativeStyleContextController({children}: Props) { - const bridge = useContext(BridgeContext); - const store = useContext(StoreContext); + const bridge = useContext(BridgeContext); + const store = useContext(StoreContext); const getStyleAndLayout = useCallback( (id: number) => { @@ -95,7 +98,7 @@ function NativeStyleContextController({children}: Props) { // It's very important that this context consumes selectedElementID and not NativeStyleID. // Otherwise the effect that sends the "inspect" message across the bridge- // would itself be blocked by the same render that suspends (waiting for the data). - const {selectedElementID} = useContext(TreeStateContext); + const {selectedElementID} = useContext(TreeStateContext); const [ currentStyleAndLayout, diff --git a/packages/react-devtools-shared/src/devtools/views/Components/OwnersStack.js b/packages/react-devtools-shared/src/devtools/views/Components/OwnersStack.js index 6be2a699991e8..609a77b001e6a 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/OwnersStack.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/OwnersStack.js @@ -77,7 +77,7 @@ export default function OwnerStack() { const {ownerID} = useContext(TreeStateContext); const treeDispatch = useContext(TreeDispatcherContext); - const [state, dispatch] = useReducer(dialogReducer, { + const [state, dispatch] = useReducer(dialogReducer, { ownerID: null, owners: [], selectedIndex: 0, diff --git a/packages/react-devtools-shared/src/devtools/views/Components/SelectedElement.js b/packages/react-devtools-shared/src/devtools/views/Components/SelectedElement.js index 563cd6f6374fe..f65b8e0a777e5 100644 --- a/packages/react-devtools-shared/src/devtools/views/Components/SelectedElement.js +++ b/packages/react-devtools-shared/src/devtools/views/Components/SelectedElement.js @@ -37,9 +37,11 @@ import { import styles from './SelectedElement.css'; +import type {ContextMenuContextType} from '../context'; import type { CopyInspectedElementPath, GetInspectedElementPath, + InspectedElementContextType, StoreAsGlobal, } from './InspectedElementContext'; import type {Element, InspectedElement} from './types'; @@ -62,8 +64,7 @@ export default function SelectedElement(_: Props) { getInspectedElementPath, getInspectedElement, storeAsGlobal, - viewInspectedElementPath, - } = useContext(InspectedElementContext); + } = useContext(InspectedElementContext); const element = inspectedElementID !== null @@ -244,7 +245,6 @@ export default function SelectedElement(_: Props) { getInspectedElementPath={getInspectedElementPath} inspectedElement={inspectedElement} storeAsGlobal={storeAsGlobal} - viewInspectedElementPath={viewInspectedElementPath} /> )}
@@ -270,7 +270,6 @@ function InspectedElementView({ getInspectedElementPath, inspectedElement, storeAsGlobal, - viewInspectedElementPath, }: InspectedElementViewProps) { const {id, type} = element; const { @@ -293,7 +292,7 @@ function InspectedElementView({ const { isEnabledForInspectedElement, viewAttributeSourceFunction, - } = useContext(ContextMenuContext); + } = useContext(ContextMenuContext); const inspectContextPath = useCallback( (path: Array) => { diff --git a/packages/react-devtools-shared/src/devtools/views/ModalDialog.js b/packages/react-devtools-shared/src/devtools/views/ModalDialog.js index 014a317049d01..770c106d8c871 100644 --- a/packages/react-devtools-shared/src/devtools/views/ModalDialog.js +++ b/packages/react-devtools-shared/src/devtools/views/ModalDialog.js @@ -78,7 +78,7 @@ type Props = {| |}; function ModalDialogContextController({children}: Props) { - const [state, dispatch] = useReducer(dialogReducer, { + const [state, dispatch] = useReducer(dialogReducer, { canBeDismissed: true, content: null, isVisible: false, diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraph.js b/packages/react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraph.js index f86573037e12c..77afddbf040ee 100644 --- a/packages/react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraph.js +++ b/packages/react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraph.js @@ -96,7 +96,9 @@ type Props = {| |}; function CommitFlamegraph({chartData, commitTree, height, width}: Props) { - const [hoveredFiberData, hoverFiber] = useState(null); + const [hoveredFiberData, hoverFiber] = useState( + null, + ); const {lineHeight} = useContext(SettingsContext); const {selectFiber, selectedFiberID} = useContext(ProfilerContext); diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/CommitRanked.js b/packages/react-devtools-shared/src/devtools/views/Profiler/CommitRanked.js index e20692fd4df94..996433dffc282 100644 --- a/packages/react-devtools-shared/src/devtools/views/Profiler/CommitRanked.js +++ b/packages/react-devtools-shared/src/devtools/views/Profiler/CommitRanked.js @@ -94,7 +94,9 @@ type Props = {| |}; function CommitRanked({chartData, commitTree, height, width}: Props) { - const [hoveredFiberData, hoverFiber] = useState(null); + const [hoveredFiberData, hoverFiber] = useState( + null, + ); const {lineHeight} = useContext(SettingsContext); const {selectedFiberID, selectFiber} = useContext(ProfilerContext); diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js b/packages/react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js index 71b82267b8372..f9e0460220a10 100644 --- a/packages/react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js +++ b/packages/react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js @@ -124,7 +124,10 @@ function ProfilerContextController({children}: Props) { supportsProfiling, } = useSubscription(subscription); - const [prevProfilingData, setPrevProfilingData] = useState(); + const [ + prevProfilingData, + setPrevProfilingData, + ] = useState(null); const [rootID, setRootID] = useState(null); if (prevProfilingData !== profilingData) { diff --git a/packages/react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.js b/packages/react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.js index 8d7112b31e226..7f14438aaa6ec 100644 --- a/packages/react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.js +++ b/packages/react-devtools-shared/src/devtools/views/Profiler/ProfilingImportExportButtons.js @@ -39,7 +39,9 @@ export default function ProfilingImportExportButtons() { return; } - if (profilingData !== null && downloadRef.current !== null) { + const anchorElement = downloadRef.current; + + if (profilingData !== null && anchorElement !== null) { const profilingDataExport = prepareProfilingDataExport(profilingData); const date = new Date(); const dateString = date @@ -55,7 +57,7 @@ export default function ProfilingImportExportButtons() { }) .replace(/:/g, '-'); downloadFile( - downloadRef.current, + anchorElement, `profiling-data.${dateString}.${timeString}.json`, JSON.stringify(profilingDataExport, null, 2), ); diff --git a/packages/react-devtools-shared/src/devtools/views/context.js b/packages/react-devtools-shared/src/devtools/views/context.js index fcc59935d4551..a26d704cd28a6 100644 --- a/packages/react-devtools-shared/src/devtools/views/context.js +++ b/packages/react-devtools-shared/src/devtools/views/context.js @@ -23,7 +23,7 @@ StoreContext.displayName = 'StoreContext'; export type ContextMenuContextType = {| isEnabledForInspectedElement: boolean, - viewAttributeSourceFunction?: ?ViewAttributeSource, + viewAttributeSourceFunction: ViewAttributeSource | null, |}; export const ContextMenuContext = createContext({ diff --git a/packages/react-devtools-shared/src/devtools/views/hooks.js b/packages/react-devtools-shared/src/devtools/views/hooks.js index a8fb43dd61a12..cace5451df589 100644 --- a/packages/react-devtools-shared/src/devtools/views/hooks.js +++ b/packages/react-devtools-shared/src/devtools/views/hooks.js @@ -78,6 +78,7 @@ export function useEditableValue( externalValue: any, ): [UseEditableValueState, UseEditableValueDispatch] { const [state, dispatch] = useReducer< + UseEditableValueState, UseEditableValueState, UseEditableValueAction, >(useEditableValueReducer, { @@ -158,7 +159,7 @@ export function useLocalStorage( } }, [initialValue, key]); - const [storedValue, setStoredValue] = useState(getValueFromLocalStorage); + const [storedValue, setStoredValue] = useState(getValueFromLocalStorage); const setValue = useCallback( value => { diff --git a/packages/react-devtools-shell/src/app/SuspenseTree/index.js b/packages/react-devtools-shell/src/app/SuspenseTree/index.js index 73701922d2250..0044485b8bd1e 100644 --- a/packages/react-devtools-shell/src/app/SuspenseTree/index.js +++ b/packages/react-devtools-shell/src/app/SuspenseTree/index.js @@ -128,7 +128,7 @@ function SuspenseListTest() { } function LoadLater() { - const [loadChild, setLoadChild] = useState(0); + const [loadChild, setLoadChild] = useState(false); return ( { +): ?ReactEventResponderListener { return React.DEPRECATED_useResponder(ContextMenuResponder, props); } diff --git a/packages/react-interactions/events/src/dom/Focus.js b/packages/react-interactions/events/src/dom/Focus.js index 5b4e184915280..17a9b72d6bc89 100644 --- a/packages/react-interactions/events/src/dom/Focus.js +++ b/packages/react-interactions/events/src/dom/Focus.js @@ -494,6 +494,7 @@ const focusResponderImpl = { }, }; +// $FlowFixMe Can't add generic types without causing a parsing/syntax errors export const FocusResponder = React.DEPRECATED_createResponder( 'Focus', focusResponderImpl, @@ -501,7 +502,7 @@ export const FocusResponder = React.DEPRECATED_createResponder( export function useFocus( props: FocusProps, -): ReactEventResponderListener { +): ?ReactEventResponderListener { return React.DEPRECATED_useResponder(FocusResponder, props); } @@ -680,6 +681,7 @@ const focusWithinResponderImpl = { }, }; +// $FlowFixMe Can't add generic types without causing a parsing/syntax errors export const FocusWithinResponder = React.DEPRECATED_createResponder( 'FocusWithin', focusWithinResponderImpl, @@ -687,6 +689,6 @@ export const FocusWithinResponder = React.DEPRECATED_createResponder( export function useFocusWithin( props: FocusWithinProps, -): ReactEventResponderListener { +): ?ReactEventResponderListener { return React.DEPRECATED_useResponder(FocusWithinResponder, props); } diff --git a/packages/react-interactions/events/src/dom/Hover.js b/packages/react-interactions/events/src/dom/Hover.js index 73c18714c9211..c7db1d1bb7754 100644 --- a/packages/react-interactions/events/src/dom/Hover.js +++ b/packages/react-interactions/events/src/dom/Hover.js @@ -378,6 +378,7 @@ const hoverResponderFallbackImpl = { onUnmount: unmountResponder, }; +// $FlowFixMe Can't add generic types without causing a parsing/syntax errors export const HoverResponder = React.DEPRECATED_createResponder( 'Hover', hasPointerEvents ? hoverResponderImpl : hoverResponderFallbackImpl, @@ -385,6 +386,6 @@ export const HoverResponder = React.DEPRECATED_createResponder( export function useHover( props: HoverProps, -): ReactEventResponderListener { +): ?ReactEventResponderListener { return React.DEPRECATED_useResponder(HoverResponder, props); } diff --git a/packages/react-interactions/events/src/dom/Input.js b/packages/react-interactions/events/src/dom/Input.js index f7f40546d4ff3..dbe0e98dae927 100644 --- a/packages/react-interactions/events/src/dom/Input.js +++ b/packages/react-interactions/events/src/dom/Input.js @@ -212,6 +212,7 @@ const inputResponderImpl = { }, }; +// $FlowFixMe Can't add generic types without causing a parsing/syntax errors export const InputResponder = React.DEPRECATED_createResponder( 'Input', inputResponderImpl, @@ -219,6 +220,6 @@ export const InputResponder = React.DEPRECATED_createResponder( export function useInput( props: InputResponderProps, -): ReactEventResponderListener { +): ?ReactEventResponderListener { return React.DEPRECATED_useResponder(InputResponder, props); } diff --git a/packages/react-interactions/events/src/dom/Keyboard.js b/packages/react-interactions/events/src/dom/Keyboard.js index fa3575849cd3e..4e8a23ded61ab 100644 --- a/packages/react-interactions/events/src/dom/Keyboard.js +++ b/packages/react-interactions/events/src/dom/Keyboard.js @@ -229,6 +229,7 @@ const keyboardResponderImpl = { }, }; +// $FlowFixMe Can't add generic types without causing a parsing/syntax errors export const KeyboardResponder = React.DEPRECATED_createResponder( 'Keyboard', keyboardResponderImpl, @@ -236,6 +237,6 @@ export const KeyboardResponder = React.DEPRECATED_createResponder( export function useKeyboard( props: KeyboardProps, -): ReactEventResponderListener { +): ?ReactEventResponderListener { return React.DEPRECATED_useResponder(KeyboardResponder, props); } diff --git a/packages/react-interactions/events/src/dom/PressLegacy.js b/packages/react-interactions/events/src/dom/PressLegacy.js index c9791ce3d7b4f..d869eace7535b 100644 --- a/packages/react-interactions/events/src/dom/PressLegacy.js +++ b/packages/react-interactions/events/src/dom/PressLegacy.js @@ -903,6 +903,7 @@ const pressResponderImpl = { }, }; +// $FlowFixMe Can't add generic types without causing a parsing/syntax errors export const PressResponder = React.DEPRECATED_createResponder( 'Press', pressResponderImpl, @@ -910,6 +911,6 @@ export const PressResponder = React.DEPRECATED_createResponder( export function usePress( props: PressProps, -): ReactEventResponderListener { +): ?ReactEventResponderListener { return React.DEPRECATED_useResponder(PressResponder, props); } diff --git a/packages/react-interactions/events/src/dom/Tap.js b/packages/react-interactions/events/src/dom/Tap.js index 9d81531099f8a..e633a71cbd0c5 100644 --- a/packages/react-interactions/events/src/dom/Tap.js +++ b/packages/react-interactions/events/src/dom/Tap.js @@ -721,11 +721,14 @@ const responderImpl = { }, }; +// $FlowFixMe Can't add generic types without causing a parsing/syntax errors export const TapResponder = React.DEPRECATED_createResponder( 'Tap', responderImpl, ); -export function useTap(props: TapProps): ReactEventResponderListener { +export function useTap( + props: TapProps, +): ?ReactEventResponderListener { return React.DEPRECATED_useResponder(TapResponder, props); } diff --git a/packages/react/src/React.js b/packages/react/src/React.js index 3fd7304f99398..7524e779596e6 100644 --- a/packages/react/src/React.js +++ b/packages/react/src/React.js @@ -3,6 +3,8 @@ * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. + * + * @flow */ import ReactVersion from 'shared/ReactVersion'; diff --git a/packages/react/src/ReactHooks.js b/packages/react/src/ReactHooks.js index c725b0e7c54e0..8df2eeb326110 100644 --- a/packages/react/src/ReactHooks.js +++ b/packages/react/src/ReactHooks.js @@ -37,7 +37,7 @@ function resolveDispatcher() { export function useContext( Context: ReactContext, unstable_observedBits: number | boolean | void, -) { +): T { const dispatcher = resolveDispatcher(); if (__DEV__) { if (unstable_observedBits !== undefined) { diff --git a/packages/shared/ReactTypes.js b/packages/shared/ReactTypes.js index 74c255577dbd7..2b87427cba8fc 100644 --- a/packages/shared/ReactTypes.js +++ b/packages/shared/ReactTypes.js @@ -66,6 +66,9 @@ export type ReactContext = { // DEV only _currentRenderer?: Object | null, _currentRenderer2?: Object | null, + // This value may be added by application code + // to improve DEV tooling display names + displayName?: string, ... };