mirror of
https://github.com/umami-software/umami.git
synced 2026-02-12 16:45:35 +01:00
Retention report UI updates.
This commit is contained in:
parent
9b8fa08d82
commit
2c8996b68f
12 changed files with 110 additions and 93 deletions
|
|
@ -1,29 +1,11 @@
|
|||
import { createPortal } from 'react-dom';
|
||||
import { useDocumentClick, useKeyDown } from 'react-basics';
|
||||
import classNames from 'classnames';
|
||||
import styles from './PopupForm.module.css';
|
||||
|
||||
export function PopupForm({ element, className, children, onClose }) {
|
||||
const { right, top } = element.getBoundingClientRect();
|
||||
const style = { position: 'absolute', left: right, top };
|
||||
|
||||
useKeyDown('Escape', onClose);
|
||||
|
||||
useDocumentClick(e => {
|
||||
if (e.target !== element && !element?.parentElement?.contains(e.target)) {
|
||||
onClose();
|
||||
}
|
||||
});
|
||||
|
||||
const handleClick = e => {
|
||||
e.stopPropagation();
|
||||
};
|
||||
|
||||
return createPortal(
|
||||
<div className={classNames(styles.form, className)} style={style} onClick={handleClick}>
|
||||
export function PopupForm({ className, style, children }) {
|
||||
return (
|
||||
<div className={classNames(styles.form, className)} style={style}>
|
||||
{children}
|
||||
</div>,
|
||||
document.body,
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue