FumeNodes/ox_lib
1
0
Fork 0
mirror of https://github.com/CommunityOx/ox_lib.git synced 2026-08-19 07:56:02 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(nui): Add scale fade transition to context menu

Browse Source
This commit is contained in:
Luke
2022-03-26 09:59:26 +01:00
parent 331fb890c9
commit a3874965bc
1 changed files with 100 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
web/src/components/ContextMenu.tsx
View File

@@ -9,6 +9,7 @@ import {
PopoverContent, PopoverContent,
PopoverBody, PopoverBody,
Spacer, Spacer,
ScaleFade,
} from "@chakra-ui/react"; } from "@chakra-ui/react";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { debugData } from "../utils/debugData"; import { debugData } from "../utils/debugData";
@@ -81,6 +82,7 @@ const ContextMenu: React.FC = () => {
justifyContent="flex-end" justifyContent="flex-end"
alignItems="center" alignItems="center"
> >
<ScaleFade in={visible} unmountOnExit>
<Box w="xs" h={580}> <Box w="xs" h={580}>
<Box borderRadius="md" bg="gray.800" mb={3}> <Box borderRadius="md" bg="gray.800" mb={3}>
<Text <Text
@@ -155,11 +157,13 @@ const ContextMenu: React.FC = () => {
<PopoverBody> <PopoverBody>
{option[1]?.metadata && {option[1]?.metadata &&
Array.isArray(option[1].metadata) ? ( Array.isArray(option[1].metadata) ? (
option[1].metadata.map((metadata: string, index) => ( option[1].metadata.map(
(metadata: string, index) => (
<Text key={`context-metadata-${index}`}> <Text key={`context-metadata-${index}`}>
{metadata} {metadata}
</Text> </Text>
)) )
)
) : ( ) : (
<> <>
{typeof option[1].metadata === "object" && {typeof option[1].metadata === "object" &&
@@ -181,6 +185,7 @@ const ContextMenu: React.FC = () => {
))} ))}
</Box> </Box>
</Box> </Box>
</ScaleFade>
</Flex> </Flex>
); );
}; };