()
| 8 | import { Button, Menu, Text, useMantineTheme } from '@mantine/core'; |
| 9 | |
| 10 | export function ButtonMenu() { |
| 11 | const theme = useMantineTheme(); |
| 12 | return ( |
| 13 | <Menu |
| 14 | transitionProps={{ transition: 'pop-top-right' }} |
| 15 | position="top-end" |
| 16 | width={220} |
| 17 | withinPortal |
| 18 | radius="md" |
| 19 | > |
| 20 | <Menu.Target> |
| 21 | <Button rightSection={<IconChevronDown size={18} stroke={1.5} />} pr={12} radius="md"> |
| 22 | Create new |
| 23 | </Button> |
| 24 | </Menu.Target> |
| 25 | <Menu.Dropdown> |
| 26 | <Menu.Item |
| 27 | leftSection={<IconPackage size={16} color={theme.colors.blue[6]} stroke={1.5} />} |
| 28 | rightSection={ |
| 29 | <Text size="xs" tt="uppercase" fw={700} c="dimmed"> |
| 30 | Ctrl + P |
| 31 | </Text> |
| 32 | } |
| 33 | > |
| 34 | Project |
| 35 | </Menu.Item> |
| 36 | <Menu.Item |
| 37 | leftSection={<IconSquareCheck size={16} color={theme.colors.pink[6]} stroke={1.5} />} |
| 38 | rightSection={ |
| 39 | <Text size="xs" tt="uppercase" fw={700} c="dimmed"> |
| 40 | Ctrl + T |
| 41 | </Text> |
| 42 | } |
| 43 | > |
| 44 | Task |
| 45 | </Menu.Item> |
| 46 | <Menu.Item |
| 47 | leftSection={<IconUsers size={16} color={theme.colors.cyan[6]} stroke={1.5} />} |
| 48 | rightSection={ |
| 49 | <Text size="xs" tt="uppercase" fw={700} c="dimmed"> |
| 50 | Ctrl + U |
| 51 | </Text> |
| 52 | } |
| 53 | > |
| 54 | Team |
| 55 | </Menu.Item> |
| 56 | <Menu.Item |
| 57 | leftSection={<IconCalendar size={16} color={theme.colors.violet[6]} stroke={1.5} />} |
| 58 | rightSection={ |
| 59 | <Text size="xs" tt="uppercase" fw={700} c="dimmed"> |
| 60 | Ctrl + E |
| 61 | </Text> |
| 62 | } |
| 63 | > |
| 64 | Event |
| 65 | </Menu.Item> |
| 66 | </Menu.Dropdown> |
| 67 | </Menu> |
nothing calls this directly
no outgoing calls
no test coverage detected