v1.0.6

This release improves the way you can 'pluck' props that were passed to the outer component.

Instead of plucking props with a pluck function and having to specify prop names twice...

const MyComponent = extendComponent('div')<{
   name: string
}>((Div, props) => {
   const { name } = props.pluck('name');
   return <Div>{name}</Div>
});

...you can now destructure props directly on the props object.

const MyComponent = extendComponent('div')<{
   name: string
}>((Div, { name }) => {
   return <Div>{name}</Div>
});

The library will automatically detect which props you're using within the component. It does this by providing you with a new object with getters for all of the props. The getters notify the library of which props you access in the component.

You can now access all the prop helper functions with the third argument of the render function.

const MyComponent = extendComponent('div')((Div, _, helpers) => {
   const peekedProps = helpers.peek();
   const pluckedProps = helpers.pluck('onClick');
   const detectedPluckedProps = helpers.detectPlucked();
   return <Div></Div>
});