React + TypeScript = ❤️

withProps.tsx

type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;

export function withProps<InjectingProps extends {}>(injectingProps: InjectingProps) {
  return function <ExtendedProps extends InjectingProps>(SourceComponent: React.ComponentType<ExtendedProps>) {
    type WithPropsHocProps = Omit<ExtendedProps, keyof InjectingProps>;

    class WithPropsHoc extends React.PureComponent<WithPropsHocProps> {
      render() {
        return (
          <SourceComponent {...this.props} {...injectingProps}>
            {this.props.children}
          </SourceComponent>
        );
      }
    }

    return WithPropsHoc;
  };
}

const Comp = withProps({
  a: 1,
  b: 2,
  с: 'string',
})(
  props => <div>{props.a + props.b + props.с}</div>,
);

<Comp />;

withPropsNotWorking.tsx

type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;

export function withProps<ExtendedProps extends InjectingProps, InjectingProps>(injector: (props: Omit<ExtendedProps, keyof InjectingProps>) => InjectingProps) {
  return function (SourceComponent: React.ComponentType<ExtendedProps>) {
    type WithPropsHocProps = Omit<ExtendedProps, keyof InjectingProps>;

    class WithPropsHoc extends React.PureComponent<WithPropsHocProps> {
      render() {
        return (
          <SourceComponent {...this.props} {...injector(this.props)}>
            {this.props.children}
          </SourceComponent>
        );
      }
    }

    return WithPropsHoc;
  };
}

const Comp = withProps(props => ({ id: props }))(
  props => <div>{props.children}</div>,
);

<Comp />;