propper

Reduce React props on the fly without redux

Example

Propped Component:

import { propper } from '@overlaylabs/propper'
import React from 'react'

// standard React components
class MyComponent extends React.Component {}

// function (much like mapStateToProps) which reduces props
const reduceProps = ({ items }) => {
  return {
    visibleItems: items.filter(item => item.visbile)
  }
}

// wrap the component
export default propper(reduceProps)(MyComponent)

Parent Component:

import MyComponent from 'myComponent'
import React from 'react'

// standard React Component
class ParentComponent extends React.Component {
  render() {
    const itemProps = [
      { id: 1, visible: true },
      { id: 2, visible: false },
      { id: 3, visible: true }
    ]
    return (<MyComponent items={itemProps} />);
  }
}