@samitouri / QOS-React-2 / commits / fc16293f3f

Flow: well_formed_exports for devtools (#25266)

Jan Kassens committed Sep 15, 2022 at 16:45 UTC fc16293f3f8fd4483f0c8f358d1f2187fbb07463

50 files changed +323 -190

packages/react-devtools-shared/src/Logger.js

+1 -1

@@ -74,7 +74,7 @@ export const logEvent: LogFunction =

74 }

75 : function logEvent() {};

77 -export const registerEventLogger =

77 +export const registerEventLogger: (logFunction: LogFunction) => () => void =

78 enableLogger === true

79 ? function registerEventLogger(logFunction: LogFunction): () => void {

80 if (enableLogger) {

packages/react-devtools-shared/src/backend/agent.js

+99 -64

@@ -254,7 +254,9 @@ export default class Agent extends EventEmitter<{

254 return this._rendererInterfaces;

255 }

256

257 - clearErrorsAndWarnings = ({rendererID}: {rendererID: RendererID}) => {

257 + clearErrorsAndWarnings: ({rendererID: RendererID}) => void = ({

258 + rendererID,

259 + }) => {

260 const renderer = this._rendererInterfaces[rendererID];

261 if (renderer == null) {

262 console.warn(`Invalid renderer id "${rendererID}"`);

@@ -263,7 +265,7 @@ export default class Agent extends EventEmitter<{

265 }

266 };

267

266 - clearErrorsForFiberID = ({id, rendererID}: ElementAndRendererID) => {

268 + clearErrorsForFiberID: ElementAndRendererID => void = ({id, rendererID}) => {

269 const renderer = this._rendererInterfaces[rendererID];

270 if (renderer == null) {

271 console.warn(`Invalid renderer id "${rendererID}"`);

@@ -272,7 +274,10 @@ export default class Agent extends EventEmitter<{

274 }

275 };

276

275 - clearWarningsForFiberID = ({id, rendererID}: ElementAndRendererID) => {

277 + clearWarningsForFiberID: ElementAndRendererID => void = ({

278 + id,

279 + rendererID,

280 + }) => {

281 const renderer = this._rendererInterfaces[rendererID];

282 if (renderer == null) {

283 console.warn(`Invalid renderer id "${rendererID}"`);

@@ -281,7 +286,11 @@ export default class Agent extends EventEmitter<{

286 }

287 };

288

284 - copyElementPath = ({id, path, rendererID}: CopyElementParams) => {

289 + copyElementPath: CopyElementParams => void = ({

290 + id,

291 + path,

292 + rendererID,

293 + }: CopyElementParams) => {

294 const renderer = this._rendererInterfaces[rendererID];

295 if (renderer == null) {

296 console.warn(`Invalid renderer id "${rendererID}" for element "${id}"`);

@@ -290,7 +299,13 @@ export default class Agent extends EventEmitter<{

299 }

300 };

301

293 - deletePath = ({hookID, id, path, rendererID, type}: DeletePathParams) => {

302 + deletePath: DeletePathParams => void = ({

303 + hookID,

304 + id,

305 + path,

306 + rendererID,

307 + type,

308 + }: DeletePathParams) => {

309 const renderer = this._rendererInterfaces[rendererID];

310 if (renderer == null) {

311 console.warn(`Invalid renderer id "${rendererID}" for element "${id}"`);

@@ -344,18 +359,18 @@ export default class Agent extends EventEmitter<{

359 return null;

360 }

361

347 - getBackendVersion = () => {

362 + getBackendVersion: () => void = () => {

363 const version = process.env.DEVTOOLS_VERSION;

364 if (version) {

365 this._bridge.send('backendVersion', version);

366 }

367 };

368

354 - getBridgeProtocol = () => {

369 + getBridgeProtocol: () => void = () => {

370 this._bridge.send('bridgeProtocol', currentBridgeProtocol);

371 };

372

358 - getProfilingData = ({rendererID}: {rendererID: RendererID}) => {

373 + getProfilingData: ({rendererID: RendererID}) => void = ({rendererID}) => {

374 const renderer = this._rendererInterfaces[rendererID];

375 if (renderer == null) {

376 console.warn(`Invalid renderer id "${rendererID}"`);

@@ -364,11 +379,11 @@ export default class Agent extends EventEmitter<{

379 this._bridge.send('profilingData', renderer.getProfilingData());

380 };

381

367 - getProfilingStatus = () => {

382 + getProfilingStatus: () => void = () => {

383 this._bridge.send('profilingStatus', this._isProfiling);

384 };

385

371 - getOwnersList = ({id, rendererID}: ElementAndRendererID) => {

386 + getOwnersList: ElementAndRendererID => void = ({id, rendererID}) => {

387 const renderer = this._rendererInterfaces[rendererID];

388 if (renderer == null) {

389 console.warn(`Invalid renderer id "${rendererID}" for element "${id}"`);

@@ -378,13 +393,13 @@ export default class Agent extends EventEmitter<{

393 }

394 };

395

381 - inspectElement = ({

396 + inspectElement: InspectElementParams => void = ({

397 forceFullData,

398 id,

399 path,

400 rendererID,

401 requestID,

387 - }: InspectElementParams) => {

402 + }) => {

403 const renderer = this._rendererInterfaces[rendererID];

404 if (renderer == null) {

405 console.warn(`Invalid renderer id "${rendererID}" for element "${id}"`);

@@ -414,7 +429,7 @@ export default class Agent extends EventEmitter<{

429 }

430 };

431

417 - logElementToConsole = ({id, rendererID}: ElementAndRendererID) => {

432 + logElementToConsole: ElementAndRendererID => void = ({id, rendererID}) => {

433 const renderer = this._rendererInterfaces[rendererID];

434 if (renderer == null) {

435 console.warn(`Invalid renderer id "${rendererID}" for element "${id}"`);

@@ -423,7 +438,11 @@ export default class Agent extends EventEmitter<{

438 }

439 };

440

426 - overrideError = ({id, rendererID, forceError}: OverrideErrorParams) => {

441 + overrideError: OverrideErrorParams => void = ({

442 + id,

443 + rendererID,

444 + forceError,

445 + }) => {

446 const renderer = this._rendererInterfaces[rendererID];

447 if (renderer == null) {

448 console.warn(`Invalid renderer id "${rendererID}" for element "${id}"`);

@@ -432,11 +451,11 @@ export default class Agent extends EventEmitter<{

451 }

452 };

453

435 - overrideSuspense = ({

454 + overrideSuspense: OverrideSuspenseParams => void = ({

455 id,

456 rendererID,

457 forceFallback,

439 - }: OverrideSuspenseParams) => {

458 + }) => {

459 const renderer = this._rendererInterfaces[rendererID];

460 if (renderer == null) {

461 console.warn(`Invalid renderer id "${rendererID}" for element "${id}"`);

@@ -445,14 +464,14 @@ export default class Agent extends EventEmitter<{

464 }

465 };

466

448 - overrideValueAtPath = ({

467 + overrideValueAtPath: OverrideValueAtPathParams => void = ({

468 hookID,

469 id,

470 path,

471 rendererID,

472 type,

473 value,

455 - }: OverrideValueAtPathParams) => {

474 + }) => {

475 const renderer = this._rendererInterfaces[rendererID];

476 if (renderer == null) {

477 console.warn(`Invalid renderer id "${rendererID}" for element "${id}"`);

@@ -463,13 +482,13 @@ export default class Agent extends EventEmitter<{

482

483 // Temporarily support older standalone front-ends by forwarding the older message types

484 // to the new "overrideValueAtPath" command the backend is now listening to.

466 - overrideContext = ({

485 + overrideContext: SetInParams => void = ({

486 id,

487 path,

488 rendererID,

489 wasForwarded,

490 value,

472 - }: SetInParams) => {

491 + }) => {

492 // Don't forward a message that's already been forwarded by the front-end Bridge.

493 // We only need to process the override command once!

494 if (!wasForwarded) {

@@ -485,14 +504,14 @@ export default class Agent extends EventEmitter<{

504

505 // Temporarily support older standalone front-ends by forwarding the older message types

506 // to the new "overrideValueAtPath" command the backend is now listening to.

488 - overrideHookState = ({

507 + overrideHookState: OverrideHookParams => void = ({

508 id,

509 hookID,

510 path,

511 rendererID,

512 wasForwarded,

513 value,

495 - }: OverrideHookParams) => {

514 + }) => {

515 // Don't forward a message that's already been forwarded by the front-end Bridge.

516 // We only need to process the override command once!

517 if (!wasForwarded) {

@@ -508,13 +527,13 @@ export default class Agent extends EventEmitter<{

527

528 // Temporarily support older standalone front-ends by forwarding the older message types

529 // to the new "overrideValueAtPath" command the backend is now listening to.

511 - overrideProps = ({

530 + overrideProps: SetInParams => void = ({

531 id,

532 path,

533 rendererID,

534 wasForwarded,

535 value,

517 - }: SetInParams) => {

536 + }) => {

537 // Don't forward a message that's already been forwarded by the front-end Bridge.

538 // We only need to process the override command once!

539 if (!wasForwarded) {

@@ -530,13 +549,13 @@ export default class Agent extends EventEmitter<{

549

550 // Temporarily support older standalone front-ends by forwarding the older message types

551 // to the new "overrideValueAtPath" command the backend is now listening to.

533 - overrideState = ({

552 + overrideState: SetInParams => void = ({

553 id,

554 path,

555 rendererID,

556 wasForwarded,

557 value,

539 - }: SetInParams) => {

558 + }) => {

559 // Don't forward a message that's already been forwarded by the front-end Bridge.

560 // We only need to process the override command once!

561 if (!wasForwarded) {

@@ -550,7 +569,9 @@ export default class Agent extends EventEmitter<{

569 }

570 };

571

553 - reloadAndProfile = (recordChangeDescriptions: boolean) => {

572 + reloadAndProfile: (

573 + recordChangeDescriptions: boolean,

574 + ) => void = recordChangeDescriptions => {

575 sessionStorageSetItem(SESSION_STORAGE_RELOAD_AND_PROFILE_KEY, 'true');

576 sessionStorageSetItem(

577 SESSION_STORAGE_RECORD_CHANGE_DESCRIPTIONS_KEY,

@@ -563,14 +584,14 @@ export default class Agent extends EventEmitter<{

584 this._bridge.send('reloadAppForProfiling');

585 };

586

566 - renamePath = ({

587 + renamePath: RenamePathParams => void = ({

588 hookID,

589 id,

590 newPath,

591 oldPath,

592 rendererID,

593 type,

573 - }: RenamePathParams) => {

594 + }) => {

595 const renderer = this._rendererInterfaces[rendererID];

596 if (renderer == null) {

597 console.warn(`Invalid renderer id "${rendererID}" for element "${id}"`);

@@ -607,7 +628,9 @@ export default class Agent extends EventEmitter<{

628 }

629 }

630

610 - setTraceUpdatesEnabled = (traceUpdatesEnabled: boolean) => {

631 + setTraceUpdatesEnabled: (

632 + traceUpdatesEnabled: boolean,

633 + ) => void = traceUpdatesEnabled => {

634 this._traceUpdatesEnabled = traceUpdatesEnabled;

635

636 setTraceUpdatesEnabled(traceUpdatesEnabled);

@@ -620,7 +643,7 @@ export default class Agent extends EventEmitter<{

643 }

644 };

645

623 - syncSelectionFromNativeElementsPanel = () => {

646 + syncSelectionFromNativeElementsPanel: () => void = () => {

647 const target = window.__REACT_DEVTOOLS_GLOBAL_HOOK__.$0;

648 if (target == null) {

649 return;

@@ -628,12 +651,14 @@ export default class Agent extends EventEmitter<{

651 this.selectNode(target);

652 };

653

631 - shutdown = () => {

654 + shutdown: () => void = () => {

655 // Clean up the overlay if visible, and associated events.

656 this.emit('shutdown');

657 };

658

636 - startProfiling = (recordChangeDescriptions: boolean) => {

659 + startProfiling: (

660 + recordChangeDescriptions: boolean,

661 + ) => void = recordChangeDescriptions => {

662 this._recordChangeDescriptions = recordChangeDescriptions;

663 this._isProfiling = true;

664 for (const rendererID in this._rendererInterfaces) {

@@ -645,7 +670,7 @@ export default class Agent extends EventEmitter<{

670 this._bridge.send('profilingStatus', this._isProfiling);

671 };

672

648 - stopProfiling = () => {

673 + stopProfiling: () => void = () => {

674 this._isProfiling = false;

675 this._recordChangeDescriptions = false;

676 for (const rendererID in this._rendererInterfaces) {

@@ -657,11 +682,16 @@ export default class Agent extends EventEmitter<{

682 this._bridge.send('profilingStatus', this._isProfiling);

683 };

684

660 - stopInspectingNative = (selected: boolean) => {

685 + stopInspectingNative: (selected: boolean) => void = selected => {

686 this._bridge.send('stopInspectingNative', selected);

687 };

688

664 - storeAsGlobal = ({count, id, path, rendererID}: StoreAsGlobalParams) => {

689 + storeAsGlobal: StoreAsGlobalParams => void = ({

690 + count,

691 + id,

692 + path,

693 + rendererID,

694 + }) => {

695 const renderer = this._rendererInterfaces[rendererID];

696 if (renderer == null) {

697 console.warn(`Invalid renderer id "${rendererID}" for element "${id}"`);

@@ -670,18 +700,18 @@ export default class Agent extends EventEmitter<{

700 }

701 };

702

673 - updateConsolePatchSettings = ({

703 + updateConsolePatchSettings: ({

704 + appendComponentStack: boolean,

705 + breakOnConsoleErrors: boolean,

706 + browserTheme: BrowserTheme,

707 + hideConsoleLogsInStrictMode: boolean,

708 + showInlineWarningsAndErrors: boolean,

709 + }) => void = ({

710 appendComponentStack,

711 breakOnConsoleErrors,

712 showInlineWarningsAndErrors,

713 hideConsoleLogsInStrictMode,

714 browserTheme,

679 - }: {

680 - appendComponentStack: boolean,

681 - breakOnConsoleErrors: boolean,

682 - showInlineWarningsAndErrors: boolean,

683 - hideConsoleLogsInStrictMode: boolean,

684 - browserTheme: BrowserTheme,

715 }) => {

716 // If the frontend preference has change,

717 // or in the case of React Native- if the backend is just finding out the preference-

@@ -696,7 +726,9 @@ export default class Agent extends EventEmitter<{

726 });

727 };

728

699 - updateComponentFilters = (componentFilters: Array<ComponentFilter>) => {

729 + updateComponentFilters: (

730 + componentFilters: Array<ComponentFilter>,

731 + ) => void = componentFilters => {

732 for (const rendererID in this._rendererInterfaces) {

733 const renderer = ((this._rendererInterfaces[

734 (rendererID: any)

@@ -705,7 +737,7 @@ export default class Agent extends EventEmitter<{

737 }

738 };

739

708 - viewAttributeSource = ({id, path, rendererID}: CopyElementParams) => {

740 + viewAttributeSource: CopyElementParams => void = ({id, path, rendererID}) => {

741 const renderer = this._rendererInterfaces[rendererID];

742 if (renderer == null) {

743 console.warn(`Invalid renderer id "${rendererID}" for element "${id}"`);

@@ -714,7 +746,7 @@ export default class Agent extends EventEmitter<{

746 }

747 };

748

717 - viewElementSource = ({id, rendererID}: ElementAndRendererID) => {

749 + viewElementSource: ElementAndRendererID => void = ({id, rendererID}) => {

750 const renderer = this._rendererInterfaces[rendererID];

751 if (renderer == null) {

752 console.warn(`Invalid renderer id "${rendererID}" for element "${id}"`);

@@ -723,11 +755,11 @@ export default class Agent extends EventEmitter<{

755 }

756 };

757

726 - onTraceUpdates = (nodes: Set<NativeType>) => {

758 + onTraceUpdates: (nodes: Set<NativeType>) => void = nodes => {

759 this.emit('traceUpdates', nodes);

760 };

761

730 - onFastRefreshScheduled = () => {

762 + onFastRefreshScheduled: () => void = () => {

763 if (__DEBUG__) {

764 debug('onFastRefreshScheduled');

765 }

@@ -735,7 +767,7 @@ export default class Agent extends EventEmitter<{

767 this._bridge.send('fastRefreshScheduled');

768 };

769

738 - onHookOperations = (operations: Array<number>) => {

770 + onHookOperations: (operations: Array<number>) => void = operations => {

771 if (__DEBUG__) {

772 debug(

773 'onHookOperations',

@@ -800,19 +832,22 @@ export default class Agent extends EventEmitter<{

832 this._bridge.send('unsupportedRendererVersion', rendererID);

833 }

834

803 - _throttledPersistSelection = throttle((rendererID: number, id: number) => {

804 - // This is throttled, so both renderer and selected ID

805 - // might not be available by the time we read them.

806 - // This is why we need the defensive checks here.

807 - const renderer = this._rendererInterfaces[rendererID];

808 - const path = renderer != null ? renderer.getPathForElement(id) : null;

809 - if (path !== null) {

810 - sessionStorageSetItem(

811 - SESSION_STORAGE_LAST_SELECTION_KEY,

812 - JSON.stringify(({rendererID, path}: PersistedSelection)),

813 - );

814 - } else {

815 - sessionStorageRemoveItem(SESSION_STORAGE_LAST_SELECTION_KEY);

816 - }

817 - }, 1000);

835 + _throttledPersistSelection: any = throttle(

836 + (rendererID: number, id: number) => {

837 + // This is throttled, so both renderer and selected ID

838 + // might not be available by the time we read them.

839 + // This is why we need the defensive checks here.

840 + const renderer = this._rendererInterfaces[rendererID];

841 + const path = renderer != null ? renderer.getPathForElement(id) : null;

842 + if (path !== null) {

843 + sessionStorageSetItem(

844 + SESSION_STORAGE_LAST_SELECTION_KEY,

845 + JSON.stringify(({rendererID, path}: PersistedSelection)),

846 + );

847 + } else {

848 + sessionStorageRemoveItem(SESSION_STORAGE_LAST_SELECTION_KEY);

849 + }

850 + },

851 + 1000,

852 + );

853 }

packages/react-devtools-shared/src/backend/utils.js

+3 -1

@@ -119,7 +119,9 @@ export function copyWithSet(

119 return updated;

120 }

121

122 -export function getEffectDurations(root: Object) {

122 +export function getEffectDurations(

123 + root: Object,

124 +): {effectDuration: any | null, passiveEffectDuration: any | null} {

125 // Profiling durations are only available for certain builds.

126 // If available, they'll be stored on the HostRoot.

127 let effectDuration = null;

packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenu.js

+1 -1

@@ -53,7 +53,7 @@ type Props = {

53 id: string,

54 };

56 -export default function ContextMenu({children, id}: Props) {

56 +export default function ContextMenu({children, id}: Props): React.Node {

57 const {hideMenu, registerMenu} = useContext<RegistryContextType>(

58 RegistryContext,

59 );

packages/react-devtools-shared/src/devtools/ContextMenu/ContextMenuItem.js

+5 -1

@@ -21,7 +21,11 @@ type Props = {

21 title: string,

22 };

24 -export default function ContextMenuItem({children, onClick, title}: Props) {

24 +export default function ContextMenuItem({

25 + children,

26 + onClick,

27 + title,

28 +}: Props): React.Node {

29 const {hideMenu} = useContext<RegistryContextType>(RegistryContext);

31 const handleClick = event => {

packages/react-devtools-shared/src/devtools/ContextMenu/Contexts.js

+9 -5

@@ -7,6 +7,8 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 +

12 import {createContext} from 'react';

14 export type ShowFn = ({data: Object, pageX: number, pageY: number}) => void;

@@ -81,8 +83,10 @@ export type RegistryContextType = {

83 registerMenu: typeof registerMenu,

84 };

84 -export const RegistryContext = createContext<RegistryContextType>({

85 - hideMenu,

86 - showMenu,

87 - registerMenu,

88 -});

86 +export const RegistryContext: ReactContext<RegistryContextType> = createContext<RegistryContextType>(

87 + {

88 + hideMenu,

89 + showMenu,

90 + registerMenu,

91 + },

92 +);

packages/react-devtools-shared/src/devtools/ProfilerStore.js

+8 -6

@@ -201,10 +201,10 @@ export default class ProfilerStore extends EventEmitter<{

201 // We do this to avoid mismatches on e.g. CommitTreeBuilder that would cause errors.

202 }

203

204 - _takeProfilingSnapshotRecursive = (

204 + _takeProfilingSnapshotRecursive: (

205 elementID: number,

206 profilingSnapshots: Map<number, SnapshotNode>,

207 - ) => {

207 + ) => void = (elementID, profilingSnapshots) => {

208 const element = this._store.getElementByID(elementID);

209 if (element !== null) {

210 const snapshotNode: SnapshotNode = {

@@ -223,7 +223,7 @@ export default class ProfilerStore extends EventEmitter<{

223 }

224 };

225

226 - onBridgeOperations = (operations: Array<number>) => {

226 + onBridgeOperations: (operations: Array<number>) => void = operations => {

227 // The first two values are always rendererID and rootID

228 const rendererID = operations[0];

229 const rootID = operations[1];

@@ -249,7 +249,9 @@ export default class ProfilerStore extends EventEmitter<{

249 }

250 };

251

252 - onBridgeProfilingData = (dataBackend: ProfilingDataBackend) => {

252 + onBridgeProfilingData: (

253 + dataBackend: ProfilingDataBackend,

254 + ) => void = dataBackend => {

255 if (this._isProfiling) {

256 // This should never happen, but if it does- ignore previous profiling data.

257 return;

@@ -279,14 +281,14 @@ export default class ProfilerStore extends EventEmitter<{

281 }

282 };

283

282 - onBridgeShutdown = () => {

284 + onBridgeShutdown: () => void = () => {

285 this._bridge.removeListener('operations', this.onBridgeOperations);

286 this._bridge.removeListener('profilingData', this.onBridgeProfilingData);

287 this._bridge.removeListener('profilingStatus', this.onProfilingStatus);

288 this._bridge.removeListener('shutdown', this.onBridgeShutdown);

289 };

290

289 - onProfilingStatus = (isProfiling: boolean) => {

291 + onProfilingStatus: (isProfiling: boolean) => void = isProfiling => {

292 if (isProfiling) {

293 this._dataBackends.splice(0);

294 this._dataFrontend = null;

packages/react-devtools-shared/src/devtools/ProfilingCache.js

+8 -22

@@ -33,26 +33,20 @@ export default class ProfilingCache {

33 this._profilerStore = profilerStore;

34 }

36 - getCommitTree = ({

37 - commitIndex,

38 - rootID,

39 - }: {

36 + getCommitTree: ({

37 commitIndex: number,

38 rootID: number,

42 - }) =>

39 + }) => CommitTree = ({commitIndex, rootID}) =>

40 getCommitTree({

41 commitIndex,

42 profilerStore: this._profilerStore,

43 rootID,

44 });

49 - getFiberCommits = ({

50 - fiberID,

51 - rootID,

52 - }: {

46 + getFiberCommits: ({

47 fiberID: number,

48 rootID: number,

55 - }): Array<number> => {

49 + }) => Array<number> = ({fiberID, rootID}) => {

50 const cachedFiberCommits = this._fiberCommits.get(fiberID);

51 if (cachedFiberCommits != null) {

52 return cachedFiberCommits;

@@ -71,15 +65,11 @@ export default class ProfilingCache {

65 return fiberCommits;

66 };

74 - getFlamegraphChartData = ({

75 - commitIndex,

76 - commitTree,

77 - rootID,

78 - }: {

68 + getFlamegraphChartData: ({

69 commitIndex: number,

70 commitTree: CommitTree,

71 rootID: number,

82 - }): FlamegraphChartData =>

72 + }) => FlamegraphChartData = ({commitIndex, commitTree, rootID}) =>

73 getFlamegraphChartData({

74 commitIndex,

75 commitTree,

@@ -87,15 +77,11 @@ export default class ProfilingCache {

77 rootID,

78 });

90 - getRankedChartData = ({

91 - commitIndex,

92 - commitTree,

93 - rootID,

94 - }: {

80 + getRankedChartData: ({

81 commitIndex: number,

82 commitTree: CommitTree,

83 rootID: number,

98 - }): RankedChartData =>

84 + }) => RankedChartData = ({commitIndex, commitTree, rootID}) =>

85 getRankedChartData({

86 commitIndex,

87 commitTree,

packages/react-devtools-shared/src/devtools/store.js

+20 -17

@@ -828,10 +828,10 @@ export default class Store extends EventEmitter<{

828 }

829 }

830

831 - _adjustParentTreeWeight = (

831 + _adjustParentTreeWeight: (

832 parentElement: Element | null,

833 weightDelta: number,

834 - ) => {

834 + ) => void = (parentElement, weightDelta) => {

835 let isInsideCollapsedSubTree = false;

836

837 while (parentElement != null) {

@@ -869,20 +869,17 @@ export default class Store extends EventEmitter<{

869 }

870 }

871

872 - onBridgeNativeStyleEditorSupported = ({

873 - isSupported,

874 - validAttributes,

875 - }: {

872 + onBridgeNativeStyleEditorSupported: ({

873 isSupported: boolean,

874 validAttributes: ?$ReadOnlyArray<string>,

878 - }) => {

875 + }) => void = ({isSupported, validAttributes}) => {

876 this._isNativeStyleEditorSupported = isSupported;

877 this._nativeStyleEditorValidAttributes = validAttributes || null;

878

879 this.emit('supportsNativeStyleEditor');

880 };

881

885 - onBridgeOperations = (operations: Array<number>) => {

882 + onBridgeOperations: (operations: Array<number>) => void = operations => {

883 if (__DEBUG__) {

884 console.groupCollapsed('onBridgeOperations');

885 debug('onBridgeOperations', operations.join(','));

@@ -1328,15 +1325,15 @@ export default class Store extends EventEmitter<{

1325 // this message enables the backend to override the frontend's current ("saved") filters.

1326 // This action should also override the saved filters too,

1327 // else reloading the frontend without reloading the backend would leave things out of sync.

1331 - onBridgeOverrideComponentFilters = (

1328 + onBridgeOverrideComponentFilters: (

1329 componentFilters: Array<ComponentFilter>,

1333 - ) => {

1330 + ) => void = componentFilters => {

1331 this._componentFilters = componentFilters;

1332

1333 setSavedComponentFilters(componentFilters);

1334 };

1335

1339 - onBridgeShutdown = () => {

1336 + onBridgeShutdown: () => void = () => {

1337 if (__DEBUG__) {

1338 debug('onBridgeShutdown', 'unsubscribing from Bridge');

1339 }

@@ -1373,30 +1370,36 @@ export default class Store extends EventEmitter<{

1370 }

1371 };

1372

1376 - onBackendStorageAPISupported = (isBackendStorageAPISupported: boolean) => {

1373 + onBackendStorageAPISupported: (

1374 + isBackendStorageAPISupported: boolean,

1375 + ) => void = isBackendStorageAPISupported => {

1376 this._isBackendStorageAPISupported = isBackendStorageAPISupported;

1377

1378 this.emit('supportsReloadAndProfile');

1379 };

1380

1382 - onBridgeSynchronousXHRSupported = (isSynchronousXHRSupported: boolean) => {

1381 + onBridgeSynchronousXHRSupported: (

1382 + isSynchronousXHRSupported: boolean,

1383 + ) => void = isSynchronousXHRSupported => {

1384 this._isSynchronousXHRSupported = isSynchronousXHRSupported;

1385

1386 this.emit('supportsReloadAndProfile');

1387 };

1388

1388 - onBridgeUnsupportedRendererVersion = () => {

1389 + onBridgeUnsupportedRendererVersion: () => void = () => {

1390 this._unsupportedRendererVersionDetected = true;

1391

1392 this.emit('unsupportedRendererVersionDetected');

1393 };

1394

1394 - onBridgeBackendVersion = (backendVersion: string) => {

1395 + onBridgeBackendVersion: (backendVersion: string) => void = backendVersion => {

1396 this._backendVersion = backendVersion;

1397 this.emit('backendVersion');

1398 };

1399

1399 - onBridgeProtocol = (bridgeProtocol: BridgeProtocol) => {

1400 + onBridgeProtocol: (

1401 + bridgeProtocol: BridgeProtocol,

1402 + ) => void = bridgeProtocol => {

1403 if (this._onBridgeProtocolTimeoutID !== null) {

1404 clearTimeout(this._onBridgeProtocolTimeoutID);

1405 this._onBridgeProtocolTimeoutID = null;

@@ -1411,7 +1414,7 @@ export default class Store extends EventEmitter<{

1414 }

1415 };

1416

1414 - onBridgeProtocolTimeout = () => {

1417 + onBridgeProtocolTimeout: () => void = () => {

1418 this._onBridgeProtocolTimeoutID = null;

1419

1420 // If we timed out, that indicates the backend predates the bridge protocol,

packages/react-devtools-shared/src/devtools/utils.js

+2 -2

@@ -149,7 +149,7 @@ export function printStore(

149 // We use JSON.parse to parse string values

150 // e.g. 'foo' is not valid JSON but it is a valid string

151 // so this method replaces e.g. 'foo' with "foo"

152 -export function sanitizeForParse(value: any) {

152 +export function sanitizeForParse(value: any): any | string {

153 if (typeof value === 'string') {

154 if (

155 value.length >= 2 &&

@@ -162,7 +162,7 @@ export function sanitizeForParse(value: any) {

162 return value;

163 }

164

165 -export function smartParse(value: any) {

165 +export function smartParse(value: any): any | void | number {

166 switch (value) {

167 case 'Infinity':

168 return Infinity;

packages/react-devtools-shared/src/devtools/views/Button.js

+1 -1

@@ -26,7 +26,7 @@ export default function Button({

26 testName,

27 title,

28 ...rest

29 -}: Props) {

29 +}: Props): React.Node {

30 let button = (

31 // $FlowFixMe unsafe spread

32 <button

packages/react-devtools-shared/src/devtools/views/Components/Components.js

+3 -1

@@ -258,4 +258,6 @@ function setResizeCSSVariable(

258 }

259 }

260

261 -export default portaledContent(Components);

261 +export default (portaledContent(

262 + Components,

263 +): React$StatelessFunctionalComponent<{}>);

packages/react-devtools-shared/src/devtools/views/Components/ExpandCollapseToggle.js

+1 -1

@@ -23,7 +23,7 @@ export default function ExpandCollapseToggle({

23 disabled,

24 isOpen,

25 setIsOpen,

26 -}: ExpandCollapseToggleProps) {

26 +}: ExpandCollapseToggleProps): React.Node {

27 return (

28 <Button

29 className={styles.ExpandCollapseToggle}

packages/react-devtools-shared/src/devtools/views/Components/FetchFileWithCachingContext.js

+5 -1

@@ -7,12 +7,16 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 +

12 import {createContext} from 'react';

14 export type FetchFileWithCaching = (url: string) => Promise<string>;

15 export type Context = FetchFileWithCaching | null;

15 -const FetchFileWithCachingContext = createContext<Context>(null);

17 +const FetchFileWithCachingContext: ReactContext<Context> = createContext<Context>(

18 + null,

19 +);

20 FetchFileWithCachingContext.displayName = 'FetchFileWithCachingContext';

22 export default FetchFileWithCachingContext;

packages/react-devtools-shared/src/devtools/views/Components/HookNamesModuleLoaderContext.js

+5 -1

@@ -7,6 +7,8 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 +

12 import type {Thenable} from 'shared/ReactTypes';

14 import {createContext} from 'react';

@@ -16,7 +18,9 @@ export type HookNamesModuleLoaderFunction = () => Thenable<ParseHookNamesModule>

18 export type Context = HookNamesModuleLoaderFunction | null;

20 // TODO (Webpack 5) Hopefully we can remove this context entirely once the Webpack 5 upgrade is completed.

19 -const HookNamesModuleLoaderContext = createContext<Context>(null);

21 +const HookNamesModuleLoaderContext: ReactContext<Context> = createContext<Context>(

22 + null,

23 +);

24 HookNamesModuleLoaderContext.displayName = 'HookNamesModuleLoaderContext';

26 export default HookNamesModuleLoaderContext;

packages/react-devtools-shared/src/devtools/views/Components/InspectedElementContext.js

+6 -2

@@ -7,6 +7,8 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 +

12 import * as React from 'react';

13 import {

14 createContext,

@@ -55,7 +57,7 @@ type Context = {

57 toggleParseHookNames: ToggleParseHookNames,

58 };

58 -export const InspectedElementContext = createContext<Context>(

60 +export const InspectedElementContext: ReactContext<Context> = createContext<Context>(

61 ((null: any): Context),

62 );

@@ -65,7 +67,9 @@ export type Props = {

67 children: ReactNodeList,

68 };

68 -export function InspectedElementContextController({children}: Props) {

70 +export function InspectedElementContextController({

71 + children,

72 +}: Props): React.Node {

73 const {selectedElementID} = useContext(TreeStateContext);

74 const fetchFileWithCaching = useContext(FetchFileWithCachingContext);

75 const bridge = useContext(BridgeContext);

packages/react-devtools-shared/src/devtools/views/Components/InspectedElementHooksTree.js

+3 -2

@@ -417,5 +417,6 @@ function HookView({

417 }

418 }

419

420 -// $FlowFixMe

421 -export default React.memo(InspectedElementHooksTree);

420 +export default (React.memo(

421 + InspectedElementHooksTree,

422 +): React.ComponentType<HookViewProps>);

packages/react-devtools-shared/src/devtools/views/Components/KeyValue.js

+1 -1

@@ -75,7 +75,7 @@ export default function KeyValue({

75 pathRoot,

76 store,

77 value,

78 -}: KeyValueProps) {

78 +}: KeyValueProps): React.Node {

79 const {readOnly: readOnlyGlobalFlag} = useContext(OptionsContext);

80 canDeletePaths = !readOnlyGlobalFlag && canDeletePaths;

81 canEditValues = !readOnlyGlobalFlag && canEditValues;

packages/react-devtools-shared/src/devtools/views/Components/NativeStyleEditor/context.js

+6 -2

@@ -7,6 +7,8 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 +

12 import * as React from 'react';

13 import {

14 createContext,

@@ -41,7 +43,9 @@ type Context = {

43 getStyleAndLayout: GetStyleAndLayout,

44 };

44 -const NativeStyleContext = createContext<Context>(((null: any): Context));

46 +const NativeStyleContext: ReactContext<Context> = createContext<Context>(

47 + ((null: any): Context),

48 +);

49 NativeStyleContext.displayName = 'NativeStyleContext';

51 type ResolveFn = (styleAndLayout: StyleAndLayoutFrontend) => void;

@@ -79,7 +83,7 @@ type Props = {

83 children: React$Node,

84 };

82 -function NativeStyleContextController({children}: Props) {

86 +function NativeStyleContextController({children}: Props): React.Node {

87 const bridge = useContext<FrontendBridge>(BridgeContext);

88 const store = useContext<Store>(StoreContext);

packages/react-devtools-shared/src/devtools/views/Components/OwnersListContext.js

+6 -2

@@ -7,6 +7,8 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 +

12 import * as React from 'react';

13 import {createContext, useCallback, useContext, useEffect} from 'react';

14 import {createResource} from '../../cache';

@@ -23,7 +25,9 @@ import type {Resource, Thenable} from '../../cache';

26 type Context = (id: number) => Array<SerializedElement> | null;

26 -const OwnersListContext = createContext<Context>(((null: any): Context));

28 +const OwnersListContext: ReactContext<Context> = createContext<Context>(

29 + ((null: any): Context),

30 +);

31 OwnersListContext.displayName = 'OwnersListContext';

33 type ResolveFn = (ownersList: Array<SerializedElement> | null) => void;

@@ -61,7 +65,7 @@ type Props = {

65 children: React$Node,

66 };

64 -function OwnersListContextController({children}: Props) {

68 +function OwnersListContextController({children}: Props): React.Node {

69 const bridge = useContext(BridgeContext);

70 const store = useContext(StoreContext);

71 const {ownerID} = useContext(TreeStateContext);

packages/react-devtools-shared/src/devtools/views/Components/TreeContext.js

+5 -3

@@ -24,6 +24,8 @@

24 // For this reason, changes to the tree context are processed in sequence: tree -> search -> owners

25 // This enables each section to potentially override (or mask) previous values.

27 +import type {ReactContext} from 'shared/ReactTypes';

28 +

29 import * as React from 'react';

30 import {

31 createContext,

@@ -148,12 +150,12 @@ type Action =

150

151 export type DispatcherContext = (action: Action) => void;

152

151 -const TreeStateContext = createContext<StateContext>(

153 +const TreeStateContext: ReactContext<StateContext> = createContext<StateContext>(

154 ((null: any): StateContext),

155 );

156 TreeStateContext.displayName = 'TreeStateContext';

157

156 -const TreeDispatcherContext = createContext<DispatcherContext>(

158 +const TreeDispatcherContext: ReactContext<DispatcherContext> = createContext<DispatcherContext>(

159 ((null: any): DispatcherContext),

160 );

161 TreeDispatcherContext.displayName = 'TreeDispatcherContext';

@@ -835,7 +837,7 @@ function TreeContextController({

837 defaultOwnerID,

838 defaultSelectedElementID,

839 defaultSelectedElementIndex,

838 -}: Props) {

840 +}: Props): React.Node {

841 const bridge = useContext(BridgeContext);

842 const store = useContext(StoreContext);

843

packages/react-devtools-shared/src/devtools/views/Components/TreeFocusedContext.js

+3 -1

@@ -7,8 +7,10 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 +

12 import {createContext} from 'react';

12 -const TreeFocusedContext = createContext<boolean>(false);

14 +const TreeFocusedContext: ReactContext<boolean> = createContext<boolean>(false);

16 export default TreeFocusedContext;

packages/react-devtools-shared/src/devtools/views/Components/ViewElementSourceContext.js

+5 -1

@@ -7,6 +7,8 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 +

12 import {createContext} from 'react';

14 import type {

@@ -19,7 +21,9 @@ export type Context = {

21 viewElementSourceFunction: ViewElementSource | null,

22 };

22 -const ViewElementSourceContext = createContext<Context>(((null: any): Context));

24 +const ViewElementSourceContext: ReactContext<Context> = createContext<Context>(

25 + ((null: any): Context),

26 +);

27 ViewElementSourceContext.displayName = 'ViewElementSourceContext';

29 export default ViewElementSourceContext;

packages/react-devtools-shared/src/devtools/views/Components/ViewSourceContext.js

+5 -1

@@ -7,6 +7,8 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 +

12 import {createContext} from 'react';

14 import type {ViewUrlSource} from 'react-devtools-shared/src/devtools/views/DevTools';

@@ -15,7 +17,9 @@ export type Context = {

17 viewUrlSourceFunction: ViewUrlSource | null,

18 };

18 -const ViewSourceContext = createContext<Context>(((null: any): Context));

20 +const ViewSourceContext: ReactContext<Context> = createContext<Context>(

21 + ((null: any): Context),

22 +);

23 ViewSourceContext.displayName = 'ViewSourceContext';

25 export default ViewSourceContext;

packages/react-devtools-shared/src/devtools/views/ErrorBoundary/ErrorBoundary.js

+18 -5

@@ -56,7 +56,17 @@ const InitialState: State = {

56 export default class ErrorBoundary extends Component<Props, State> {

57 state: State = InitialState;

59 - static getDerivedStateFromError(error: any) {

59 + static getDerivedStateFromError(

60 + error: any,

61 + ): {

62 + callStack: string | null,

63 + errorMessage: string | null,

64 + hasError: boolean,

65 + isTimeout: boolean,

66 + isUnknownHookError: boolean,

67 + isUnsupportedBridgeOperationError: boolean,

68 + isUserError: boolean,

69 + } {

70 const errorMessage =

71 typeof error === 'object' &&

72 error !== null &&

@@ -112,7 +122,7 @@ export default class ErrorBoundary extends Component<Props, State> {

122 }

123 }

124

115 - render() {

125 + render(): React.Node {

126 const {canDismiss: canDismissProp, children} = this.props;

127 const {

128 callStack,

@@ -201,7 +211,10 @@ export default class ErrorBoundary extends Component<Props, State> {

211 return children;

212 }

213

204 - _logError = (error: any, componentStack: string | null) => {

214 + _logError: (error: any, componentStack: string | null) => void = (

215 + error,

216 + componentStack,

217 + ) => {

218 logEvent({

219 event_name: 'error',

220 error_message: error.message ?? null,

@@ -210,7 +223,7 @@ export default class ErrorBoundary extends Component<Props, State> {

223 });

224 };

225

213 - _dismissError = () => {

226 + _dismissError: () => void = () => {

227 const onBeforeDismissCallback = this.props.onBeforeDismissCallback;

228 if (typeof onBeforeDismissCallback === 'function') {

229 onBeforeDismissCallback();

@@ -219,7 +232,7 @@ export default class ErrorBoundary extends Component<Props, State> {

232 this.setState(InitialState);

233 };

234

222 - _onStoreError = (error: Error) => {

235 + _onStoreError: (error: Error) => void = error => {

236 if (!this.state.hasError) {

237 this._logError(error, null);

238 this.setState({

packages/react-devtools-shared/src/devtools/views/ModalDialog.js

+2 -1

@@ -7,6 +7,7 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 import * as React from 'react';

12 import {

13 createContext,

@@ -55,7 +56,7 @@ type ModalDialogContextType = {

56 dispatch: Dispatch,

57 };

58 -const ModalDialogContext = createContext<ModalDialogContextType>(

59 +const ModalDialogContext: ReactContext<ModalDialogContextType> = createContext<ModalDialogContextType>(

60 ((null: any): ModalDialogContextType),

61 );

62 ModalDialogContext.displayName = 'ModalDialogContext';

packages/react-devtools-shared/src/devtools/views/Profiler/CommitFlamegraphListItem.js

+5 -2

@@ -25,7 +25,7 @@ type Props = {

25 ...

26 };

28 -function CommitFlamegraphListItem({data, index, style}: Props) {

28 +function CommitFlamegraphListItem({data, index, style}: Props): React.Node {

29 const {

30 chartData,

31 onElementMouseEnter,

@@ -131,4 +131,7 @@ function CommitFlamegraphListItem({data, index, style}: Props) {

131 );

132 }

133

134 -export default memo<Props>(CommitFlamegraphListItem, areEqual);

134 +export default (memo(

135 + CommitFlamegraphListItem,

136 + areEqual,

137 +): React.ComponentType<Props>);

packages/react-devtools-shared/src/devtools/views/Profiler/CommitRankedListItem.js

+4 -1

@@ -80,4 +80,7 @@ function CommitRankedListItem({data, index, style}: Props) {

80 );

81 }

83 -export default memo<Props>(CommitRankedListItem, areEqual);

83 +export default (memo(

84 + CommitRankedListItem,

85 + areEqual,

86 +): React.ComponentType<Props>);

packages/react-devtools-shared/src/devtools/views/Profiler/Profiler.js

+1 -1

@@ -196,4 +196,4 @@ const tabsWithTimeline = [

196 },

197 ];

198

199 -export default portaledContent(Profiler);

199 +export default (portaledContent(Profiler): React.ComponentType<{}>);

packages/react-devtools-shared/src/devtools/views/Profiler/ProfilerContext.js

+5 -1

@@ -7,6 +7,8 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 +

12 import * as React from 'react';

13 import {createContext, useCallback, useContext, useMemo, useState} from 'react';

14 import {unstable_batchedUpdates as batchedUpdates} from 'react-dom';

@@ -67,7 +69,9 @@ export type Context = {

69 selectFiber: (id: number | null, name: string | null) => void,

70 };

70 -const ProfilerContext = createContext<Context>(((null: any): Context));

72 +const ProfilerContext: ReactContext<Context> = createContext<Context>(

73 + ((null: any): Context),

74 +);

75 ProfilerContext.displayName = 'ProfilerContext';

77 type StoreProfilingState = {

packages/react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitList.js

@@ -99,6 +99,7 @@ function List({

99 totalDurations,

100 width,

101 }: ListProps) {

102 + // $FlowFixMe[incompatible-use]

103 const listRef = useRef<FixedSizeList<ItemData> | null>(null);

104 const divRef = useRef<HTMLDivElement | null>(null);

105 const prevCommitIndexRef = useRef<number | null>(null);

packages/react-devtools-shared/src/devtools/views/Profiler/SnapshotCommitListItem.js

+4 -1

@@ -96,4 +96,7 @@ function SnapshotCommitListItem({data: itemData, index, style}: Props) {

96 );

97 }

99 -export default memo<Props>(SnapshotCommitListItem, areEqual);

99 +export default (memo(

100 + SnapshotCommitListItem,

101 + areEqual,

102 +): React.ComponentType<Props>);

packages/react-devtools-shared/src/devtools/views/Settings/SettingsContext.js

+6 -2

@@ -7,6 +7,8 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 +

12 import * as React from 'react';

13 import {

14 createContext,

@@ -67,7 +69,9 @@ type Context = {

69 setTraceUpdatesEnabled: (value: boolean) => void,

70 };

70 -const SettingsContext = createContext<Context>(((null: any): Context));

72 +const SettingsContext: ReactContext<Context> = createContext<Context>(

73 + ((null: any): Context),

74 +);

75 SettingsContext.displayName = 'SettingsContext';

77 function useLocalStorageWithLog<T>(

@@ -100,7 +104,7 @@ function SettingsContextController({

104 children,

105 componentsPortalContainer,

106 profilerPortalContainer,

103 -}: Props) {

107 +}: Props): React.Node {

108 const bridge = useContext(BridgeContext);

109

110 const [

packages/react-devtools-shared/src/devtools/views/Settings/SettingsModalContext.js

+10 -2

@@ -7,6 +7,8 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 +

12 import * as React from 'react';

13 import {createContext, useMemo, useState} from 'react';

@@ -19,10 +21,16 @@ type Context = {

21 ...

22 };

22 -const SettingsModalContext = createContext<Context>(((null: any): Context));

24 +const SettingsModalContext: ReactContext<Context> = createContext<Context>(

25 + ((null: any): Context),

26 +);

27 SettingsModalContext.displayName = 'SettingsModalContext';

25 -function SettingsModalContextController({children}: {children: React$Node}) {

29 +function SettingsModalContextController({

30 + children,

31 +}: {

32 + children: React$Node,

33 +}): React.Node {

34 const [isModalShowing, setIsModalShowing] = useState<boolean>(false);

36 const value = useMemo(() => ({isModalShowing, setIsModalShowing}), [

packages/react-devtools-shared/src/devtools/views/UnsupportedBridgeProtocolDialog.js

+1 -1

@@ -24,7 +24,7 @@ const INSTRUCTIONS_FB_URL =

24 'https://fb.me/devtools-unsupported-bridge-protocol';

25 const MODAL_DIALOG_ID = 'UnsupportedBridgeProtocolDialog';

27 -export default function UnsupportedBridgeProtocolDialog(_: {}) {

27 +export default function UnsupportedBridgeProtocolDialog(_: {}): null {

28 const {dialogs, dispatch} = useContext(ModalDialogContext);

29 const store = useContext(StoreContext);

packages/react-devtools-shared/src/devtools/views/UnsupportedVersionDialog.js

+1 -1

@@ -18,7 +18,7 @@ import styles from './UnsupportedVersionDialog.css';

19 type DAILOG_STATE = 'dialog-not-shown' | 'show-dialog' | 'dialog-shown';

21 -export default function UnsupportedVersionDialog(_: {}) {

21 +export default function UnsupportedVersionDialog(_: {}): null {

22 const {dispatch} = useContext(ModalDialogContext);

23 const store = useContext(StoreContext);

24 const [state, setState] = useState<DAILOG_STATE>('dialog-not-shown');

packages/react-devtools-shared/src/devtools/views/context.js

+21 -14

@@ -7,18 +7,21 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 import {createContext} from 'react';

12 import Store from '../store';

14 import type {ViewAttributeSource} from 'react-devtools-shared/src/devtools/views/DevTools';

15 import type {FrontendBridge} from 'react-devtools-shared/src/bridge';

16 -export const BridgeContext = createContext<FrontendBridge>(

17 +export const BridgeContext: ReactContext<FrontendBridge> = createContext<FrontendBridge>(

18 ((null: any): FrontendBridge),

19 );

20 BridgeContext.displayName = 'BridgeContext';

21 -export const StoreContext = createContext<Store>(((null: any): Store));

22 +export const StoreContext: ReactContext<Store> = createContext<Store>(

23 + ((null: any): Store),

24 +);

25 StoreContext.displayName = 'StoreContext';

27 export type ContextMenuContextType = {

@@ -26,10 +29,12 @@ export type ContextMenuContextType = {

29 viewAttributeSourceFunction: ViewAttributeSource | null,

30 };

29 -export const ContextMenuContext = createContext<ContextMenuContextType>({

30 - isEnabledForInspectedElement: false,

31 - viewAttributeSourceFunction: null,

32 -});

32 +export const ContextMenuContext: ReactContext<ContextMenuContextType> = createContext<ContextMenuContextType>(

33 + {

34 + isEnabledForInspectedElement: false,

35 + viewAttributeSourceFunction: null,

36 + },

37 +);

38 ContextMenuContext.displayName = 'ContextMenuContext';

40 export type OptionsContextType = {

@@ -41,11 +46,13 @@ export type OptionsContextType = {

46 hideViewSourceAction: boolean,

47 };

44 -export const OptionsContext = createContext<OptionsContextType>({

45 - readOnly: false,

46 - hideSettings: false,

47 - hideToggleErrorAction: false,

48 - hideToggleSuspenseAction: false,

49 - hideLogAction: false,

50 - hideViewSourceAction: false,

51 -});

49 +export const OptionsContext: ReactContext<OptionsContextType> = createContext<OptionsContextType>(

50 + {

51 + readOnly: false,

52 + hideSettings: false,

53 + hideToggleErrorAction: false,

54 + hideToggleSuspenseAction: false,

55 + hideLogAction: false,

56 + hideViewSourceAction: false,

57 + },

58 +);

packages/react-devtools-shared/src/devtools/views/useThemeStyles.js

+1 -1

@@ -11,7 +11,7 @@ import {useContext, useMemo} from 'react';

11 import {SettingsContext} from './Settings/SettingsContext';

12 import {THEME_STYLES} from '../../constants';

14 -const useThemeStyles = () => {

14 +const useThemeStyles = (): any => {

15 const {theme, displayDensity, browserTheme} = useContext(SettingsContext);

17 const style = useMemo(

packages/react-devtools-shared/src/node_modules/react-window/src/createGridComponent.js

+1 -1

@@ -191,7 +191,7 @@ export default function createGridComponent({

191 initInstanceProps: InitInstanceProps,

192 shouldResetStyleCacheOnItemSizeChange: boolean,

193 validateProps: ValidateProps,

194 -|}) {

194 +|}): React.ComponentType<Props<mixed>> {

195 return class Grid<T> extends PureComponent<Props<T>, State> {

196 _instanceProps: any = initInstanceProps(this.props, this);

197 _resetIsScrollingTimeoutId: TimeoutID | null = null;

packages/react-devtools-shared/src/node_modules/react-window/src/createListComponent.js

+1 -1

@@ -156,7 +156,7 @@ export default function createListComponent({

156 initInstanceProps: InitInstanceProps,

157 shouldResetStyleCacheOnItemSizeChange: boolean,

158 validateProps: ValidateProps,

159 -|}) {

159 +|}): React.ComponentType<Props<$FlowFixMe>> {

160 return class List<T> extends PureComponent<Props<T>, State> {

161 _instanceProps: any = initInstanceProps(this.props, this);

162 _outerRef: ?HTMLDivElement;

packages/react-devtools-shell/src/app/InspectableElements/SimpleValues.js

+2 -2

@@ -13,9 +13,9 @@ import {Component} from 'react';

13 function noop() {}

15 export default class SimpleValues extends Component {

16 - anonymousFunction = () => {};

16 + anonymousFunction: () => void = () => {};

18 - render() {

18 + render(): React.Node {

19 return (

20 <ChildComponent

21 string="abc"

packages/react-devtools-shell/src/app/ToDoList/ListItem.js

+1 -1

@@ -46,4 +46,4 @@ function ListItem({item, removeItem, toggleItem}: Props) {

46 );

47 }

49 -export default memo<Props>(ListItem);

49 +export default (memo(ListItem): React.ComponentType<Props>);

packages/react-devtools-timeline/src/TimelineContext.js

+6 -2

@@ -7,6 +7,8 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 +

12 import * as React from 'react';

13 import {

14 createContext,

@@ -38,14 +40,16 @@ export type Context = {

40 selectedEvent: ReactEventInfo,

41 };

41 -const TimelineContext = createContext<Context>(((null: any): Context));

43 +const TimelineContext: ReactContext<Context> = createContext<Context>(

44 + ((null: any): Context),

45 +);

46 TimelineContext.displayName = 'TimelineContext';

48 type Props = {

49 children: React$Node,

50 };

48 -function TimelineContextController({children}: Props) {

52 +function TimelineContextController({children}: Props): React.Node {

53 const searchInputContainerRef = useRef(null);

54 const [file, setFile] = useState<string | null>(null);

packages/react-devtools-timeline/src/TimelineSearchContext.js

+6 -2

@@ -7,6 +7,8 @@

7 * @flow

8 */

10 +import type {ReactContext} from 'shared/ReactTypes';

11 +

12 import * as React from 'react';

13 import {createContext, useMemo, useReducer} from 'react';

@@ -122,7 +124,9 @@ export type Context = {

124 searchText: string,

125 };

126

125 -const TimelineSearchContext = createContext<Context>(((null: any): Context));

127 +const TimelineSearchContext: ReactContext<Context> = createContext<Context>(

128 + ((null: any): Context),

129 +);

130 TimelineSearchContext.displayName = 'TimelineSearchContext';

131

132 type Props = {

@@ -135,7 +139,7 @@ function TimelineSearchContextController({

139 children,

140 profilerData,

141 viewState,

138 -}: Props) {

142 +}: Props): React.Node {

143 const [state, dispatch] = useReducer<State, State, Action>(reducer, {

144 profilerData,

145 searchIndex: -1,

packages/react-devtools-timeline/src/import-worker/index.js

+2 -1

@@ -28,4 +28,5 @@ export type ImportWorkerOutputData =

29 export type importFileFunction = (file: File) => ImportWorkerOutputData;

31 -export const importFile = (file: File) => workerizedImportFile.importFile(file);

31 +export const importFile = (file: File): Promise<ImportWorkerOutputData> =>

32 + workerizedImportFile.importFile(file);

packages/react-devtools-timeline/src/utils/formatting.js

+1 -1

@@ -20,7 +20,7 @@ export function formatTimestamp(ms: number): string {

20 );

21 }

23 -export function formatDuration(ms: number) {

23 +export function formatDuration(ms: number): string {

24 return prettyMilliseconds(ms, {millisecondsDecimalDigits: 1});

25 }

packages/react-devtools-timeline/src/view-base/VerticalScrollView.js

+3 -2

@@ -7,6 +7,7 @@

7 * @flow

8 */

10 +import type {Size, IntrinsicSize} from './geometry';

11 import type {

12 Interaction,

13 MouseDownInteraction,

@@ -78,7 +79,7 @@ export class VerticalScrollView extends View {

79 this._setScrollState(this._scrollState);

80 }

81 - desiredSize() {

82 + desiredSize(): Size | IntrinsicSize {

83 return this._contentView.desiredSize();

84 }

@@ -195,7 +196,7 @@ export class VerticalScrollView extends View {

196 }

197 }

198

198 - _handleMouseMove(interaction: MouseMoveInteraction) {

199 + _handleMouseMove(interaction: MouseMoveInteraction): void | boolean {

200 if (!this._isPanning) {

201 return;

202 }

packages/react-devtools-timeline/src/view-base/View.js

+2 -2

@@ -55,7 +55,7 @@ export class View {

55 * @see setNeedsDisplay

56 * @private

57 */

58 - _needsDisplay = true;

58 + _needsDisplay: boolean = true;

60 /**

61 * Whether the hierarchy below this view has subviews that need display.

@@ -65,7 +65,7 @@ export class View {

65 * @see setSubviewsNeedDisplay

66 * @private

67 */

68 - _subviewsNeedDisplay = false;

68 + _subviewsNeedDisplay: boolean = false;

70 constructor(

71 surface: Surface,

packages/react-devtools-timeline/src/view-base/resizable/ResizeBarView.js

+2 -2

@@ -13,7 +13,7 @@ import type {

13 MouseMoveInteraction,

14 MouseUpInteraction,

15 } from '../useCanvasInteraction';

16 -import type {Rect} from '../geometry';

16 +import type {Rect, Size} from '../geometry';

17 import type {ViewRefs} from '../Surface';

19 import {BORDER_SIZE, COLORS} from '../../content-views/constants';

@@ -42,7 +42,7 @@ export class ResizeBarView extends View {

42 this._label = label;

43 }

45 - desiredSize() {

45 + desiredSize(): Size {

46 return this.showLabel

47 ? {height: RESIZE_BAR_WITH_LABEL_HEIGHT, width: 0}

48 : {height: RESIZE_BAR_HEIGHT, width: 0};

scripts/flow/config/flowconfig

@@ -47,6 +47,11 @@ exact_by_default=true

47 munge_underscores=false

48 types_first=false

50 +well_formed_exports=true

51 +well_formed_exports.includes=<PROJECT_ROOT>/packages/react-devtools-shared

52 +well_formed_exports.includes=<PROJECT_ROOT>/packages/react-devtools-shell

53 +well_formed_exports.includes=<PROJECT_ROOT>/packages/react-devtools-timeline

54 +

55 # Substituted by createFlowConfig.js:

56 %REACT_RENDERER_FLOW_OPTIONS%