/
levkin_s
/
ui-kit-ce
Обзор
Документация
Войти
/
levkin_s
/
ui-kit-ce
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
develop
packages/hooks/examples/PopperExample.tsx
28 строк
878 B
Denis Svyatovets
v1.10.0
27 мар 2024, 13:48
27 мар 2024, 13:48
c9029ae
Код
Авторство
О чём код?
import * as React from 'react' import { Button, usePopper } from '@v-uik/base' export const PopperExample = (): JSX.Element => { const [referenceElement, setReferenceElement] = React.useState<HTMLButtonElement | null>(null) const [popperElement, setPopperElement] = React.useState<HTMLDivElement | null>(null) const [arrowElement, setArrowElement] = React.useState<HTMLDivElement | null>( null ) const { styles, attributes } = usePopper(referenceElement, popperElement, { modifiers: [{ name: 'arrow', options: { element: arrowElement } }], }) return ( <> <Button ref={setReferenceElement}>Reference element</Button> <div ref={setPopperElement} style={styles.popper} {...attributes.popper}> Popper element <div ref={setArrowElement} style={styles.arrow} /> </div> </> ) } export default PopperExample