Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(prop-types): Add bool option to the prop-types to use it with col and row props #142

Merged
merged 1 commit into from
Nov 2, 2020

Conversation

ivanbanov
Copy link
Contributor

@ivanbanov ivanbanov commented Oct 30, 2020

Summary

When composing the component styles using the xgrids + getSystemProps it shoots warnings in the console because the bool option is not enabled in the @xstyled/prop-types, it means that the props col and row will not pass the proptypes validation.

For my specific case, I work in a project where warning are not allowed in the tests and because of that the props col and row are breaking the tests

Test plan

// Component
import React from 'react'
import { PropTypes } from 'prop-types'
import { getSystemPropTypes } from '@xstyled/prop-types'
import StyledField, { systemProps } from './Field.styled'

const Field = StyledField

Field.propTypes = {
  children: PropTypes.node.isRequired,
  ...getSystemPropTypes(systemProps),
}

export default Field

// Styles
import styled from '@xstyled/emotion'
import { compose, space, flexboxes, xgrids } from '@xstyled/system'

export const systemProps = compose(space, flexboxes, xgrids)

const defaults = {}
const StyledField = styled.div(defaults, systemProps, { flexGrow: 0 })

export default StyledField

// Usage
import Field from './Field'

export default () => {
  // Warning: Failed prop type: Invalid prop `row` supplied to `Field`
  return <Filed row /* or col */ />
}

@ivanbanov ivanbanov changed the title Add bool option to the prop-types to use it with col and row props feat(prop-types): Add bool option to the prop-types to use it with col and row props Oct 30, 2020
@gregberge gregberge merged commit 3a835ba into styled-components:master Nov 2, 2020
@gregberge
Copy link
Collaborator

Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants