diff options
Diffstat (limited to 'components/Tweaks/VisualsPanel.tsx')
-rw-r--r-- | components/Tweaks/VisualsPanel.tsx | 122 |
1 files changed, 0 insertions, 122 deletions
diff --git a/components/Tweaks/VisualsPanel.tsx b/components/Tweaks/VisualsPanel.tsx deleted file mode 100644 index f364c4f..0000000 --- a/components/Tweaks/VisualsPanel.tsx +++ /dev/null @@ -1,122 +0,0 @@ -import { - Text, - Accordion, - AccordionButton, - AccordionItem, - Flex, - VStack, - AccordionIcon, - AccordionPanel, - MenuButton, - Menu, - Button, - Box, - Portal, - MenuList, - MenuItem, -} from '@chakra-ui/react' -import React, { useCallback } from 'react' -import { HighlightingPanel } from './HighlightingPanel' -import { ColorsPanel } from './ColorsPanel' -import { initialColoring, initialVisuals } from '../config' -import { NodesNLinksPanel } from './NodesNLinksPanel' -import { LabelsPanel } from './LabelsPanel' -import { CitationsPanel } from './CitationsPanel' -import { ColorMenu } from './ColorMenu' -import { ThemeSelect } from './ThemeSelect' -import { GraphColorSelect } from './GraphColorSelect' - -export interface VisualsPanelProps { - visuals: typeof initialVisuals - setVisuals: any - highlightColor: string - setHighlightColor: any - threeDim: boolean - coloring: typeof initialColoring - setColoring: any -} - -export const VisualsPanel = (props: VisualsPanelProps) => { - const { - coloring, - setColoring, - visuals, - setVisuals, - highlightColor, - setHighlightColor, - threeDim, - } = props - const setVisualsCallback = useCallback((val) => setVisuals(val), []) - return ( - <VStack justifyContent="flex-start" align="stretch"> - <ThemeSelect /> - <GraphColorSelect {...{ coloring, setColoring }} /> - <Accordion allowToggle defaultIndex={[0]} paddingLeft={3}> - <AccordionItem> - <AccordionButton> - <Flex justifyContent="space-between" w="100%"> - <Text>Colors</Text> - <AccordionIcon marginRight={2} /> - </Flex> - </AccordionButton> - <AccordionPanel> - <ColorsPanel - visuals={visuals} - setVisualsCallback={setVisualsCallback} - highlightColor={highlightColor} - setHighlightColor={setHighlightColor} - /> - </AccordionPanel> - </AccordionItem> - <AccordionItem> - <AccordionButton> - <Flex justifyContent="space-between" w="100%"> - <Text>Nodes & Links</Text> - <AccordionIcon marginRight={2} /> - </Flex> - </AccordionButton> - <AccordionPanel> - <NodesNLinksPanel - visuals={visuals} - setVisuals={setVisualsCallback} - threeDim={threeDim} - /> - </AccordionPanel> - </AccordionItem> - <AccordionItem> - <AccordionButton> - <Flex justifyContent="space-between" w="100%"> - <Text>Labels</Text> - <AccordionIcon marginRight={2} /> - </Flex> - </AccordionButton> - <AccordionPanel> - <LabelsPanel visuals={visuals} setVisuals={setVisualsCallback} /> - </AccordionPanel> - </AccordionItem> - <AccordionItem> - <AccordionButton> - <Flex justifyContent="space-between" w="100%"> - <Text>Highlighting</Text> - <AccordionIcon marginRight={2} /> - </Flex> - </AccordionButton> - <AccordionPanel> - <HighlightingPanel visuals={visuals} setVisuals={setVisualsCallback} /> - </AccordionPanel> - </AccordionItem> - <AccordionItem> - <AccordionButton> - <Flex justifyContent="space-between" w="100%"> - <Text>Citations</Text> - <AccordionIcon marginRight={2} /> - </Flex> - </AccordionButton> - <AccordionPanel> - <CitationsPanel visuals={visuals} setVisuals={setVisualsCallback} /> - </AccordionPanel> - </AccordionItem> - </Accordion> - </VStack> - ) -} |