/
kaws
/
ui-kit-ce
Обзор
Документация
Войти
/
kaws
/
ui-kit-ce
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
Аналитика
Безопасность
develop
packages/hooks/examples/PopperExample.tsx
26 строк
848 B
Ivan Iakovlev
docs(hooks): добавлены stories по хукам
20 ноя 2024, 11:54
20 ноя 2024, 11:54
7538000
Код
Авторство
О чём код?
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> </> ) }