Add Table style config key, and add v6 table styles (#1104)

Author: akleiner2

src/table/src/Table.js

@@ -1,4 +1,5 @@
 import React, { memo } from 'react'
+import { useStyleConfig } from '../../hooks'
 import { Pane } from '../../layers'
 import EditableCell from './EditableCell'
 import SearchTableHeaderCell from './SearchTableHeaderCell'
@@ -12,9 +13,22 @@ import TableVirtualBody from './TableVirtualBody'
 import TextTableCell from './TextTableCell'
 import TextTableHeaderCell from './TextTableHeaderCell'
 
+const emptyObject = {}
+
 const Table = memo(function Table(props) {
   const { children, ...rest } = props
-  return <Pane {...rest}>{children}</Pane>
+  const { className, ...boxProps } = useStyleConfig(
+    'Table',
+    emptyObject,
+    emptyObject,
+    emptyObject
+  )
+
+  return (
+    <Pane className={className} {...boxProps} {...rest}>
+      {children}
+    </Pane>
+  )
 })
 
 Table.Body = TableBody

src/table/stories/EditableTable.js

@@ -90,7 +90,6 @@ export default class EditableTable extends React.PureComponent {
                 onChange={value => this.setState({ isSelectable: value })}
               />
               <Pane
-                border
                 height="80vh"
                 display="flex"
                 flexGrow={0}

src/themes/classic/components/index.js

@@ -25,6 +25,7 @@ import Select from './select'
 import Spinner from './spinner'
 import Switch from './switch'
 import Tab from './tab'
+import Table from './table'
 import TableCell from './table-cell'
 import TableHead from './table-head'
 import TableRow from './table-row'
@@ -61,6 +62,7 @@ export default {
   Spinner,
   Switch,
   Tab,
+  Table,
   TableCell,
   TableHead,
   TableRow,

src/themes/classic/components/table.js

@@ -0,0 +1,11 @@
+const baseStyle = {}
+
+const appearances = {}
+
+const sizes = {}
+
+export default {
+  baseStyle,
+  appearances,
+  sizes
+}

src/themes/default/components/index.js

@@ -25,6 +25,7 @@ import Select from './select'
 import Spinner from './spinner'
 import Switch from './switch'
 import Tab from './tab'
+import Table from './table'
 import TableCell from './table-cell'
 import TableHead from './table-head'
 import TableRow from './table-row'
@@ -61,6 +62,7 @@ export default {
   Spinner,
   Switch,
   Tab,
+  Table,
   TableCell,
   TableHead,
   TableRow,

src/themes/default/components/table.js

@@ -0,0 +1,14 @@
+const baseStyle = {
+  borderRadius: 'radii.1',
+  border: 'muted'
+}
+
+const appearances = {}
+
+const sizes = {}
+
+export default {
+  baseStyle,
+  appearances,
+  sizes
+}