/
githubmr
/
facebook-react
Обзор
Документация
Войти
/
githubmr
/
facebook-react
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
Аналитика
main
packages/react-devtools-shared/src/devtools/views/Components/InspectHostNodesToggle.js
50 строк
1 KB
Sebastian Markbåge
[DevTools] Rename NativeElement to HostInstance in the Bridge (#30491)
30 июл 2024, 16:12
Не верифицирован
30 июл 2024, 16:12
33e54fa
Код
Авторство
О чём код?
/** * Copyright (c) Meta Platforms, Inc. and affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. * * @flow */ import * as React from 'react'; import {useCallback, useContext, useEffect, useState} from 'react'; import {BridgeContext} from '../context'; import Toggle from '../Toggle'; import ButtonIcon from '../ButtonIcon'; import {logEvent} from 'react-devtools-shared/src/Logger'; export default function InspectHostNodesToggle(): React.Node { const [isInspecting, setIsInspecting] = useState(false); const bridge = useContext(BridgeContext); const handleChange = useCallback( (isChecked: boolean) => { setIsInspecting(isChecked); if (isChecked) { logEvent({event_name: 'inspect-element-button-clicked'}); bridge.send('startInspectingHost'); } else { bridge.send('stopInspectingHost', false); } }, [bridge], ); useEffect(() => { const onStopInspectingHost = () => setIsInspecting(false); bridge.addListener('stopInspectingHost', onStopInspectingHost); return () => bridge.removeListener('stopInspectingHost', onStopInspectingHost); }, [bridge]); return ( <Toggle onChange={handleChange} isChecked={isInspecting} title="Select an element in the page to inspect it"> <ButtonIcon type="search" /> </Toggle> ); }