Skip to content

Instantly share code, notes, and snippets.

@rtymchyk

rtymchyk/omit-props-connector.js

Last active July 17, 2019 16:19
Show Gist options
  • Save rtymchyk/5b97c8e3b97cd5db6e86a8c1db223185 to your computer and use it in GitHub Desktop.
Save rtymchyk/5b97c8e3b97cd5db6e86a8c1db223185 to your computer and use it in GitHub Desktop.
Download ZIP
omit-props-connector
Raw
omit-props-connector.js
// HOC
import React from 'react'
import PropTypes from 'prop-types'
import omit from 'lodash/omit'
export default function omitProps(Component, propsToOmit) {
function WithoutOmittedProps({ children, ...rest }) {
return <Component {...omit(rest, propsToOmit)}>{children}</Component>
}
WithoutOmittedProps.propTypes = {
children: PropTypes.node,
}
WithoutOmittedProps.displayName = `WithoutOmittedProps(${Component.displayName ||
Component.name})`
return WithoutOmittedProps
}
// Component
import styled from 'styled-components'
import { space, layout, color } from 'styled-system'
import propTypes from '@styled-system/prop-types'
import omitProps from 'connectors/omit-props'
const propsToOmit = [
...Object.keys(propTypes.space),
...Object.keys(propTypes.layout),
...Object.keys(propTypes.color),
]
const Box = styled(omitProps('div', propsToOmit))`
${space}
${layout}
${color}
`
export default Box
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment