Ref does not work on custom components created with applyTheme

[MrToph]

React refs do not seem to work correctly on custom components created with applyTheme.
This seems to be because they are a functional component and they don't correctly forwardRef?

I get this error:

Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

To Reproduce

const CustomButton = applyTheme(Button, {
  styles: {
    base: {
      minHeight: "unset",
      whiteSpace: `nowrap`,
    },
  },
  defaultProps: {
    variant: "ghost",
  },
});

const App = () => {
  const buttonRef = useRef(null);
  const handleClick = () => {
    console.log(buttonRef.current) // should be defined
  }
  return (
    <CustomButton onClick={handleClick} ref={buttonRef}>
      Click
    </CustomButton>
  );
};

[jxom]

Thanks! I'll have a look into this soon! Maybe use elementRef for now?

[MrToph]

Great. I'm not aware of elementRef, I checked the docs of the Button component but couldn't find anything. Can you point me to some description of elementRef.

Edit: It's on Box

[jxom]

This should be fixed on 1.3.8