/
Korablik
/
Developer
Обзор
Документация
Войти
/
Korablik
/
Developer
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
main
src/components/BookmarksButton.tsx
27 строк
716 B
Korablevsky
fixFinal
26 мар 2024, 20:29
26 мар 2024, 20:29
ef55868
Код
Авторство
О чём код?
import { TriangleDownIcon } from '@radix-ui/react-icons' import { useRef, useState } from 'react' import { useOnClickOutside } from '../lib/hooks' import BookmarksPopover from './BookmarksPopover' export default function BookmarksButton() { const [isOpen, setIsOpen] = useState(false) const buttonRef = useRef<HTMLButtonElement>(null) const popoverRef = useRef<HTMLDivElement>(null) useOnClickOutside([buttonRef, popoverRef], () => { setIsOpen(false) }) return ( <section> <button ref={buttonRef} onClick={() => setIsOpen(prev => !prev)} className='bookmarks-btn' > Bookmarks <TriangleDownIcon /> </button> {isOpen && <BookmarksPopover ref={popoverRef} />} </section> ) }