withTheme does not forward ref

Description

The withTheme HOC is not forwarding it’s ref. Therefore it is e.g. not possible to submit a form programmatically. React.forwardRef is available from 16.3.0, an implementation would look like this:

import React, { forwardRef } from "react";
import PropTypes from "prop-types";
import Form from "./";

function withTheme(themeProps) {
  return forwardRef(({ fields, widgets, ...directProps }, ref) => (
    <Form
      {...themeProps}
      {...directProps}
      fields={{ ...themeProps.fields, ...fields }}
      widgets={{ ...themeProps.widgets, ...widgets }}
      ref={ref}
    />
  ));
}

withTheme.propTypes = {
  widgets: PropTypes.object,
  fields: PropTypes.object,
};

export default withTheme;

For now I will use my own HOC instead of withTheme. Please fix this as soon as you bump the React peer version. I will happily provide an PR then, testcase also kinda done:

  it('should forward the ref', () => {
    let ref = undefined;
    const schema = {};
    const uiSchema = {};

    createComponent(withTheme({ ref: (form) => ref = form }), {
      schema,
      uiSchema,
    });

    expect(ref.submit).to.exist();
  });

[zepatrik]

@jorisw pr is opened

[david-azevedo]

Hey @andrew-oreshko , I also encountered this issue. For now, and as a temporary fix, I created my own withTheme HOC using the code provided by @zepatrik. Beware that this will only work if your project uses react version 16.3.0 or higher.