diff --git a/src/__tests__/enhancer-test.js b/src/__tests__/enhancer-test.js
index 980abcff..e52378a2 100644
--- a/src/__tests__/enhancer-test.js
+++ b/src/__tests__/enhancer-test.js
@@ -21,6 +21,24 @@ describe('Enhancer', () => {
expect(ref.current.state).to.deep.equal({_radiumStyleState: {}});
});
+ it('sets up initial state on a function component', () => {
+ // using plugin API to get state as state hooks keep things pretty private
+ // so we cannot just dive into the component instance like with the class example
+ const dummyPlugin = sinon.spy();
+ const Composed = props =>
;
+ const Enhanced = Enhancer(Composed, {
+ plugins: [dummyPlugin]
+ });
+
+ renderFcIntoDocument();
+
+ const pluginApi = dummyPlugin.getCall(0).args[0];
+
+ expect(pluginApi.getComponentField('state')).to.deep.equal({
+ _radiumStyleState: {}
+ });
+ });
+
it('merges with existing state', () => {
class Composed extends Component {
constructor(props) {
diff --git a/src/enhancer.js b/src/enhancer.js
index 52774d33..a0c20137 100644
--- a/src/enhancer.js
+++ b/src/enhancer.js
@@ -178,7 +178,7 @@ function createEnhancedFunctionComponent(
const {radiumConfig, ...otherProps} = props;
const radiumConfigContext = useContext(RadiumConfigContext);
const styleKeeperContext = useContext(StyleKeeperContext);
- const [state, setState] = useState({});
+ const [state, setState] = useState({_radiumStyleState: {}});
const enhancerApi = useRef({
state,