// pseudo TS defs for recompose
interface ReactElement {
}

// functional component
interface BaseComponent<TProps> {
  (props: TProps): ReactElement;
}

// HOC definition
interface HOC<TIn, TOut> {
  (base: BaseComponent<TOut>):BaseComponent<TIn>;
}

function compose<TIn, TOut, T1>(p0: HOC<TIn, T1>, p1: HOC<T1, TOut>): HOC<TIn, TOut> {
  return base => p0(p1(base));
}

// mapProps HOC
function mapProps<TIn, TOut> (propsMapper: (props: TIn) => TOut): HOC<TIn, TOut> {
  return base => cProps => base(propsMapper(cProps));
}

// simple base component
interface CompProps {text: string, value: string };

// something Like react functional component
const Comp = ({ text, value }) => <ReactElement>`value=${value}  text=${text}`;

const Comp3 = compose(
  mapProps((props: { input: string }) => Object.assign(
    { text: `--${props.input}--` }, // ref 0
    props
  )),
  mapProps((props: { text: string, input: string, value: string }) => Object.assign(
    { value: props.input },         // ref 1
    props
  ))
)(Comp);

import { StatelessComponent } from 'react';
export default <StatelessComponent<ICounterProps>>composed;

import { SFC } from 'react';
export default <SFC<ICounterProps>>composed;