diff options
| -rw-r--r-- | components/tweaks.tsx | 58 |
1 files changed, 1 insertions, 57 deletions
diff --git a/components/tweaks.tsx b/components/tweaks.tsx index 2cb5b5d..686f9b8 100644 --- a/components/tweaks.tsx +++ b/components/tweaks.tsx @@ -58,6 +58,7 @@ import { } from './config' import FilterPanel from './FilterPanel' +import { ColorMenu } from './ColorMenu' import { ThemeContext } from '../util/themecontext' import { usePersistantState } from '../util/persistant-state' @@ -1362,60 +1363,3 @@ export const DropDownMenu = (props: DropDownMenuProps) => { </Menu> ) } - -export interface ColorMenuProps { - label: string - colorList: string[] - value: string - visValue: string - setVisuals?: any -} - -export const ColorMenu = (props: ColorMenuProps) => { - const { label, colorList, value, visValue, setVisuals } = props - - const clickCallback = useCallback( - (color) => - setVisuals((curr: typeof initialVisuals) => { - return { - ...curr, - [value]: color, - } - }), - [], - ) - return ( - <Flex alignItems="center" justifyContent="space-between"> - <Text>{label}</Text> - <Menu isLazy placement="right"> - <MenuButton as={Button} colorScheme="" color="black" rightIcon={<ChevronDownIcon />}> - {<Box bgColor={visValue} borderRadius="sm" height={6} width={6}></Box>} - </MenuButton> - <Portal> - {' '} - <MenuList minW={10} zIndex="popover" bgColor="gray.200"> - <MenuItem - onClick={() => clickCallback('')} - justifyContent="space-between" - alignItems="center" - display="flex" - > - <Box height={6} width={6}></Box> - </MenuItem> - {colorList.map((color: string) => ( - <MenuItem - key={color} - onClick={() => clickCallback(color)} - justifyContent="space-between" - alignItems="center" - display="flex" - > - <Box bgColor={color} borderRadius="sm" height={6} width={6}></Box> - </MenuItem> - ))} - </MenuList> - </Portal> - </Menu> - </Flex> - ) -} |