React forwardRef breaks nested styled components

[iamriot-dev]

When using React's forwardRef, nested styled components do not get styled correctly. This problem does not happen without forwardRef.

import { setup, styled } from "goober";
import React, { createElement, forwardRef } from "react";

setup(createElement);

let Text = styled("span", forwardRef)`
  color: red;
`;

let Wrapper = styled("div")`
  ${Text} {
    color: green;
  }
`;

function App() {
  return (
    <Wrapper>
      Hello <Text>World</Text>
    </Wrapper>
  );
}

Goober fails to retrieve the class name when generating the CSS.

.go3823925058 [object Object] {
  color:green;
}
.go1681785550{
  color:red;
}

This seems to be unique to React, as it is not occurring when using Preact and its forwardRef.

[cristianbote]

Interesting 🤔 Thanks for opening up this issue!