pogmommy/feishin
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add danger prop for menu items

Browse source
This commit is contained in:
jeffvli 2023-01-04 23:56:09 -08:00
parent 98ef0b44ec
commit 0c7a0cc88a
1 changed files with 4 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/renderer/components/dropdown-menu/index.tsx
View file

@ -12,6 +12,7 @@ import styled from 'styled-components';
type MenuProps = MantineMenuProps; type MenuProps = MantineMenuProps;
type MenuLabelProps = MantineMenuLabelProps; type MenuLabelProps = MantineMenuLabelProps;
interface MenuItemProps extends MantineMenuItemProps { interface MenuItemProps extends MantineMenuItemProps {
$danger?: boolean;
$isActive?: boolean; $isActive?: boolean;
children: React.ReactNode; children: React.ReactNode;
} }
@ -46,7 +47,7 @@ const StyledMenuItem = styled(MantineMenu.Item)<MenuItemProps>`
} }
& .mantine-Menu-itemLabel { & .mantine-Menu-itemLabel {
color: var(--dropdown-menu-fg); color: ${(props) => (props.$danger ? 'var(--danger-color)' : 'var(--dropdown-menu-fg)')};
font-weight: 500; font-weight: 500;
font-size: 1em; font-size: 1em;
} }
@ -90,9 +91,10 @@ const MenuLabel = ({ children, ...props }: MenuLabelProps) => {
return <StyledMenuLabel {...props}>{children}</StyledMenuLabel>; return <StyledMenuLabel {...props}>{children}</StyledMenuLabel>;
}; };
const pMenuItem = ({ $isActive, children, ...props }: MenuItemProps) => { const pMenuItem = ({ $isActive, $danger, children, ...props }: MenuItemProps) => {
return ( return (
<StyledMenuItem <StyledMenuItem
$danger={$danger}
$isActive={$isActive} $isActive={$isActive}
rightSection={$isActive && <RiArrowLeftSFill size={20} />} rightSection={$isActive && <RiArrowLeftSFill size={20} />}
{...props} {...props}