mirror of
https://github.com/docmost/docmost.git
synced 2025-11-13 00:52:40 +10:00
29 lines
676 B
TypeScript
29 lines
676 B
TypeScript
import React, { ReactElement } from 'react';
|
|
import { useElementSize } from '@mantine/hooks';
|
|
import { useMergedRef } from '@mantine/hooks';
|
|
|
|
type Props = {
|
|
children: (dimens: { width: number; height: number }) => ReactElement;
|
|
};
|
|
|
|
const style = {
|
|
flex: 1,
|
|
width: '100%',
|
|
height: '100%',
|
|
minHeight: 0,
|
|
minWidth: 0,
|
|
};
|
|
|
|
export const FillFlexParent = React.forwardRef(function FillFlexParent(
|
|
props: Props,
|
|
forwardRef
|
|
) {
|
|
const { ref, width, height } = useElementSize();
|
|
const mergedRef = useMergedRef(ref, forwardRef);
|
|
return (
|
|
<div style={style} ref={mergedRef}>
|
|
{width && height ? props.children({ width, height }) : null}
|
|
</div>
|
|
);
|
|
});
|