fix: remove extra stories, fix type errors, update typescript-eslint …

…version
cratebind · Oct 30, 2020 · cae2fa2 · cae2fa2
1 parent 44e9dd8
commit cae2fa2
Show file tree

Hide file tree

Showing 21 changed files with 319 additions and 747 deletions.
diff --git a/package.json b/package.json
@@ -54,8 +54,8 @@
     "@types/jest-axe": "^3.2.1",
     "@types/react": "^16.9.23",
     "@types/react-dom": "^16.9.5",
-    "@typescript-eslint/eslint-plugin": "^2.29.0",
-    "@typescript-eslint/parser": "^2.29.0",
+    "@typescript-eslint/eslint-plugin": "^4.6.0",
+    "@typescript-eslint/parser": "^4.6.0",
     "babel-loader": "^8.0.6",
     "babel-plugin-styled-components": "^1.11.1",
     "cz-conventional-changelog": "3.1.0",

diff --git a/src/Heading/Heading.stories.mdx b/src/Heading/Heading.stories.mdx
diff --git a/src/Image/Image.stories.mdx b/src/Image/Image.stories.mdx
diff --git a/src/Input/Input.stories.mdx b/src/Input/Input.stories.mdx
diff --git a/src/Link/Link.stories.mdx b/src/Link/Link.stories.mdx
diff --git a/src/Menu/Menu.stories.mdx b/src/Menu/Menu.stories.mdx
diff --git a/src/Menu/Menu.stories.tsx b/src/Menu/Menu.stories.tsx
@@ -7,9 +7,11 @@ import {
   MenuList,
   MenuItem,
   MenuLink,
+  MenuDivider,
 } from '.';
 import { Icon } from '..';
 import { filteredArgs } from '../utils';
+import { Flex } from '../layout';
 
 const meta: Meta = {
   title: 'Menu',
@@ -56,3 +58,33 @@ const Template: Story<MenuContainerProps> = ({}) => {
 
 export const Basic = Template.bind({});
 Basic.args = {};
+
+export const PositionedRight = () => (
+  <Flex justifyContent="flex-end">
+    <MenuContainer>
+      <MenuButton>
+        Actions <Icon name="chevron-down" ml={2} size="14px" />
+      </MenuButton>
+      <MenuList menuPosition="right">
+        <MenuItem onSelect={() => alert('Edit Profile')}>Edit Profile</MenuItem>
+        <MenuItem onSelect={() => alert('Settings')}>Settings</MenuItem>
+      </MenuList>
+    </MenuContainer>
+  </Flex>
+);
+
+export const DisabledItems = () => (
+  <MenuContainer>
+    <MenuButton>
+      Actions <Icon name="chevron-down" ml={2} size="14px" />
+    </MenuButton>
+    <MenuList>
+      <MenuItem onSelect={() => alert('Edit Profile')}>Edit Profile</MenuItem>
+      <MenuItem disabled onSelect={() => alert('Settings')}>
+        Settings
+      </MenuItem>
+      <MenuDivider />
+      <MenuLink href="https://minerva-ui-docs.vercel.app">Sign Out</MenuLink>
+    </MenuList>
+  </MenuContainer>
+);
diff --git a/src/Menu/index.tsx b/src/Menu/index.tsx
@@ -8,8 +8,9 @@ import {
   MenuItems as ReachMenuItems,
   MenuProps,
   MenuButtonProps,
+  MenuItemsProps,
 } from '@reach/menu-button';
-import { PopoverProps, positionDefault, positionRight } from '@reach/popover';
+import { positionDefault, positionRight } from '@reach/popover';
 import styled from 'styled-components';
 import Button from '../Button';
 import { Box, MinervaProps } from '../layout';
@@ -29,7 +30,7 @@ export const MenuButton = (props: MenuButtonProps & MinervaProps) => (
   <Button as={ReachMenuButton} {...props} />
 );
 
-export interface MenuListProps extends MinervaProps, PopoverProps {
+export interface MenuListProps extends MinervaProps {
   children?: React.ReactNode;
   menuPosition?: 'left' | 'right';
 }
@@ -64,7 +65,7 @@ export const OverlayBox = props => (
 export const MenuList = ({
   menuPosition = 'left',
   ...props
-}: MenuListProps) => (
+}: MenuListProps & MenuItemsProps) => (
   <ReachMenuPopover
     position={menuPosition === 'right' ? positionRight : positionDefault}
   >