diff options
Diffstat (limited to 'pages')
-rw-r--r-- | pages/index.tsx | 11 | ||||
-rw-r--r-- | pages/slidetest.tsx | 30 |
2 files changed, 39 insertions, 2 deletions
diff --git a/pages/index.tsx b/pages/index.tsx index c80fc50..5b07039 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -461,7 +461,13 @@ export function GraphPage() { const contextMenuRef = useRef<any>() const [contextMenuTarget, setContextMenuTarget] = useState<OrgRoamNode | null>(null) - const [contextPos, setContextPos] = useState({ + type ContextPos = { + left: number | undefined + right: number | undefined + top: number | undefined + bottom: number | undefined + } + const [contextPos, setContextPos] = useState<ContextPos>({ left: 0, top: 0, right: undefined, @@ -477,7 +483,7 @@ export function GraphPage() { }, }) - const openContextMenu = (node: OrgRoamNode, event: any, coords?: number[]) => { + const openContextMenu = (node: OrgRoamNode, event: any, coords?: ContextPos) => { coords ? setContextPos(coords) : setContextPos({ left: event.pageX, top: event.pageY, right: undefined, bottom: undefined }) @@ -568,6 +574,7 @@ export function GraphPage() { handleLocal, mainWindowWidth, setMainWindowWidth, + setContextMenuTarget, }} /> </Box> diff --git a/pages/slidetest.tsx b/pages/slidetest.tsx new file mode 100644 index 0000000..ca39cf9 --- /dev/null +++ b/pages/slidetest.tsx @@ -0,0 +1,30 @@ +import React from 'react' +import { Box, Button, Flex, Slide, useDisclosure } from '@chakra-ui/react' +import { Collapse } from '../components/Sidebar/Collapse' + +export default function Test() { + const { isOpen, onClose, onOpen, onToggle } = useDisclosure() + return ( + <> + <Button onClick={onToggle}>togg</Button> + <Flex flexDirection="row" justifyContent="space-between" w="100vw"> + <Box color="blue.500" width="100%"> + a + </Box> + <Collapse + animateOpacity={false} + dimension="width" + in={isOpen} + //style={{ position: 'relative' }} + unmountOnExit + endingSize={500} + startingSize={0} + > + <Box height="100vh" bgColor="red.500"> + Hey + </Box> + </Collapse> + </Flex> + </> + ) +} |