fix: Correct List overflow & Tree color typing (#2337)

Conditionally add overflow: auto if windowing is enabled

Author: Luke Bowerman

packages/components/src/List/List.test.tsx

@@ -86,10 +86,10 @@ describe('List', () => {
       expect(screen.getByTestId('after')).toHaveStyle(`height: ${height}px;`)
     })
 
-    test('no height: 100% without windowing', () => {
+    test('no "overflow: auto" without windowing', () => {
       renderWithTheme(<Basic />)
 
-      expect(screen.getByRole('list')).not.toHaveStyle('height: 100%')
+      expect(screen.getByRole('list')).not.toHaveStyle('overflow: auto')
     })
   })
   describe('color', () => {

packages/components/src/List/List.tsx

@@ -153,6 +153,7 @@ export const ListInternal = forwardRef(
           tabIndex={-1}
           role={role || 'list'}
           height={height}
+          windowing={windowing}
           {...props}
           {...navProps}
         >
@@ -174,7 +175,7 @@ const ListStyle = styled.ul
 
   list-style: none;
   margin: 0;
-  overflow: auto;
+  ${({ windowing }) => windowing !== 'none' && 'overflow: auto;'}
   padding: 0;
 `
 

packages/components/src/Tree/Tree.tsx

@@ -194,4 +194,4 @@ const TreeLayout: FC<TreeProps> = ({
   )
 }
 
-export const Tree = styled(TreeLayout)<TreeProps>``
+export const Tree = styled(TreeLayout)``

packages/components/src/Tree/TreeItem.tsx

@@ -81,4 +81,4 @@ const TreeItemLayout: FC<TreeItemProps> = ({
   )
 }
 
-export const TreeItem = styled(TreeItemLayout)<TreeItemProps>``
+export const TreeItem = styled(TreeItemLayout)``