blob: 1dcffbd973925d46fe70c8a8f7fc50f03227f8d3 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
|
import { Collapse, Stack } from "@mantine/core";
import { FunctionComponent, PropsWithChildren, useMemo, useRef } from "react";
import { useSettingValue } from "../utilities/hooks";
interface ContentProps {
settingKey: string;
on?: (k: unknown) => boolean;
indent?: boolean;
}
type Props = PropsWithChildren<ContentProps>;
const CollapseBox: FunctionComponent<Props> = ({
on,
indent,
children,
settingKey,
}) => {
const value = useSettingValue(settingKey);
const onRef = useRef(on);
onRef.current = on;
const open = useMemo<boolean>(() => {
if (onRef.current) {
return onRef.current(value);
} else {
return Boolean(value);
}
}, [value]);
return (
<Collapse in={open} pl={indent ? "md" : undefined}>
<Stack spacing="xs">{children}</Stack>
</Collapse>
);
};
export default CollapseBox;
|