Merge pull request #832 from primer/release-12.5.0

Primer 12.5.0

Author: shawnbot

CHANGELOG.md

@@ -1,3 +1,32 @@
+# 12.5.0
+
+### :rocket: Enhancement
+- Add `.Toast` component [#831](https://github.com/primer/css/pull/831)
+- Add `.SideNav` component [#827](https://github.com/primer/css/pull/827)
+- Add `.SelectMenu` component [#808](https://github.com/primer/css/pull/808)
+- Add `font-display: swap` to `@font-face` declarations [#780](https://github.com/primer/css/pull/780)
+- Add `flex-grow-0`, `flex-order-[1,2,none]` and `width-auto` utilities [#763](https://github.com/primer/css/pull/763)
+- Change default for `$marketing-font-path` to `/fonts/` [#837](https://github.com/primer/css/pull/837)
+
+### :bug: Bug Fix
+- Improve monospaced font on Chrome Android [#812](https://github.com/primer/css/pull/812)
+
+### :memo: Documentation
+- Add multi-word naming conventions to BEM docs [#836](https://github.com/primer/css/pull/836)
+- Color system docs updates [#811](https://github.com/primer/css/pull/811)
+- Color utility table tweaks [#842](https://github.com/primer/css/pull/842)
+- Fix markdown typos in Contributing docs page [#846](https://github.com/primer/css/pull/846)
+
+### Committers
+- [@ampinsk](https://github.com/ampinsk)
+- [@emilybrick](https://github.com/emilybrick)
+- [@emplums](https://github.com/emplums)
+- [@jonrohan](https://github.com/jonrohan)
+- [@shawnbot](https://github.com/shawnbot)
+- [@simurai](https://github.com/simurai)
+- [@skullface](https://github.com/skullface)
+- [@vdepizzol](https://github.com/vdepizzol)
+
 # 12.4.1
 
 ### :bug: Bug fixes
@@ -87,7 +116,7 @@
 # 12.2.2
 
 ### :bug: Bug Fix
-- Fix hide utilities when toggling between breakpoints [#746](https://github.com/primer/css/pull/746) 
+- Fix hide utilities when toggling between breakpoints [#746](https://github.com/primer/css/pull/746)
 
 ### :house: Internal
 - Prevent Storybook publish failures from breaking builds on `master` [#728](https://github.com/primer/css/pull/728)

docs/Table.js

@@ -0,0 +1,45 @@
+import styled from 'styled-components'
+import PropTypes from 'prop-types'
+import {Box} from '@primer/components'
+import {fontSize} from 'styled-system'
+
+const Table = styled.table`
+  display: table !important;
+  border-collapse: separate;
+  border-spacing: ${props => props.borderSpacing};
+  ${fontSize};
+
+  tr,
+  td,
+  th {
+    border: 0 !important;
+  }
+
+  caption,
+  td,
+  th {
+    padding: ${props => props.cellPadding} !important;
+    text-align: left;
+  }
+
+  tr {
+    background-color: transparent !important;
+  }
+`
+
+Table.propTypes = {
+  borderSpacing: PropTypes.any,
+  cellPadding: PropTypes.any,
+  ...fontSize.propTypes
+}
+
+Table.defaultProps = {
+  borderSpacing: 0,
+  cellPadding: '4px 8px',
+  fontSize: [1, 1, 2]
+}
+
+Table.Row = styled(Box).attrs({as: 'tr'})``
+Table.Cell = styled(Box).attrs({as: 'td'})``
+
+export default Table