Skip to content
Branch: master
Find file History
Latest commit 19b815b Jun 19, 2019
Permalink
Type Name Latest commit message Commit time
..
Failed to load latest commit information.
src Add buttonStyle, textStyle, & colorStyle Jun 11, 2019
test Update should-forward-prop utility for v5 Jun 2, 2019
README.md
package.json

README.md

@styled-system/should-forward-prop

Utility for filtering Styled System props with Emotion's shouldForwardProp option

npm i @styled-system/should-forward-prop
import styled from '@emotion/styled'
import {
  space,
  color,
  typography
} from 'styled-system'
import shouldForwardProp from '@styled-system/should-forward-prop'

const Box = styled('div', { shouldForwardProp })(
  space,
  color,
  typography
)

Custom Props

To exclude other custom props not included in Styled System, use the createShouldForwardProp utility.

import styled from '@emotion/styled'
import { space, color } from 'styled-system'
import { createShouldForwardProp, props } from '@styled-system/should-forward-prop'

const shouldForwardProp = createShouldForwardProp([
  ...props,
  'd',
  'x'
])

const Box = styled('div', {
  shouldForwardProp
})(props => ({
  display: props.d,
  fontWeight: props.x ? 'bold' : null,
}),
  space,
  color
)

MIT License

You can’t perform that action at this time.