⬆️ Update pss 3.0 → 4.0

Author: exah

package.json

@@ -124,7 +124,7 @@
     "@emotion/styled": "^10.0.5",
     "@exah/utils": "^2.0.0",
     "emotion-theming": "^10.0.5",
-    "pss": "^3.0.1",
+    "pss": "^4.0.0",
     "react-styled-base": "^2.0.1"
   }
 }

src/flex-box/index.js

@@ -3,7 +3,6 @@ import styled from '@emotion/styled'
 import { Box } from '../box'
 
 const FlexBox = styled(Box)({ display: 'flex' }, flex, flexItem)
-const FlexBoxItem = styled(Box)(flexItem)
 
 FlexBox.displayName = 'FlexBox'
 
@@ -12,15 +11,8 @@ FlexBox.propTypes = {
   ...flex.propTypes
 }
 
-FlexBox.Item = FlexBoxItem
-FlexBox.Item.displayName = 'FlexGrid.Item'
-
-FlexBox.Item.propTypes = {
-  ...Box.propTypes,
-  ...flexItem.propTypes
-}
+FlexBox.Item = Box // COMPAT
 
 export {
-  FlexBox,
-  FlexBoxItem
+  FlexBox
 }

src/image/index.js

@@ -2,7 +2,7 @@ import styled from '@emotion/styled'
 import { createBase } from '../base'
 
 import {
-  combine,
+  combineStyles,
   cursor,
   display,
   flexItem,
@@ -15,7 +15,7 @@ import {
   transform
 } from 'pss'
 
-const image = combine(
+const image = combineStyles(
   cursor,
   display,
   flexItem,

src/layout/index.js

@@ -1,6 +1,7 @@
 import { compose } from '@exah/utils'
 import { defaultProps, withDisplayName, withPropTypes } from '../utils'
-import { FlexBox, FlexBoxItem } from '../flex-box'
+import { FlexBox } from '../flex-box'
+import { Box } from '../box'
 
 const withLayoutProps = defaultProps({
   flexDirection: 'column',
@@ -19,9 +20,9 @@ const Layout = compose(
 
 const LayoutContent = compose(
   withDisplayName('Layout.Content'),
-  withPropTypes(FlexBoxItem),
+  withPropTypes(Box),
   withLayoutContentProps
-)(FlexBoxItem)
+)(Box)
 
 const LayoutBody = compose(
   withDisplayName('Layout.Body'),
@@ -31,13 +32,13 @@ const LayoutBody = compose(
 
 Object.assign(Layout, {
   Content: LayoutContent,
-  Item: FlexBoxItem,
+  Item: Box,
   Body: LayoutBody
 })
 
 export {
   Layout,
-  FlexBoxItem as LayoutItem,
+  Box as LayoutItem,
   LayoutContent,
   LayoutBody
 }

src/media-object/index.js

@@ -1,6 +1,7 @@
 import { compose } from '@exah/utils'
 import { defaultProps, withDisplayName, withPropTypes } from '../utils'
-import { FlexBox, FlexBoxItem } from '../flex-box'
+import { FlexBox } from '../flex-box'
+import { Box } from '../box'
 
 const MediaObject = compose(
   withDisplayName('MediaObject'),
@@ -10,15 +11,15 @@ const MediaObject = compose(
 
 const MediaObjectSide = compose(
   withDisplayName('MediaObject.Side'),
-  withPropTypes(FlexBoxItem),
+  withPropTypes(Box),
   defaultProps({ flex: '0 0' })
-)(FlexBoxItem)
+)(Box)
 
 const MediaObjectContent = compose(
   withDisplayName('MediaObject.Content'),
-  withPropTypes(FlexBoxItem),
+  withPropTypes(Box),
   defaultProps({ flex: '1', minWidth: 0 })
-)(FlexBoxItem)
+)(Box)
 
 Object.assign(MediaObject, {
   Side: MediaObjectSide,

test/__snapshots__/index.js.snap

@@ -3,9 +3,9 @@
 exports[`Box 1`] = `
 .emotion-0 {
   box-sizing: border-box;
+  height: 300px;
   margin-left: auto;
   margin-right: auto;
-  height: 300px;
   background-color: #000;
   color: #fff;
 }
@@ -674,10 +674,10 @@ exports[`MediaObject 1`] = `
 
 .emotion-2 {
   box-sizing: border-box;
-  min-width: 0;
   -webkit-flex: 1;
   -ms-flex: 1;
   flex: 1;
+  min-width: 0;
 }
 
 <div

yarn.lock

@@ -8768,10 +8768,10 @@ psl@^1.1.24, psl@^1.1.28:
   resolved "https://registry.yarnpkg.com/psl/-/psl-1.1.31.tgz#e9aa86d0101b5b105cbe93ac6b784cd547276184"
   integrity sha512-/6pt4+C+T+wZUieKR620OpzN/LlnNKuWjy1iFLQ/UG35JqHlR/89MP1d96dUfkf6Dne3TuLQzOYEYshJ+Hx8mw==
 
-pss@^3.0.1:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/pss/-/pss-3.0.1.tgz#dcf171304d0b163a80c44ff76450da20aa9cbc9c"
-  integrity sha512-go39tpJy3dONz3+6iYoFtTNhMHdoGdGyWQVG+5ctaJvpvwxO037CWdMgXUlBNmiHA7HydCrXEuIPKbvOhXaZbA==
+pss@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/pss/-/pss-4.0.0.tgz#38d9523b04aea11281117a5b295b34f1a290bdde"
+  integrity sha512-Q3gXkvT+6tBySOHmKir90q+nejz7fp+X0vMqf8y5OPyGw6NUTz/gtaERJ4BRraAbbFwfqrperm8JlTiFelr2MA==
   dependencies:
     "@exah/utils" "^2.0.0"
     prop-types "^15.6.2"