React hooks in styled component interpolation functions

[matt-tingen]

Is it considered safe to use react hooks in styled component interpolation functions? For example:

const ExampleComponent = styled('div')(() => ({
  color: useSavedColor(),
}))

It seems to work without the react error one would typically see when hooks are used in an invalid manner. However, I can't find any mention of that being guaranteed by emotion and I wasn't sure if there were any gotchas to be aware of where interpolation functions are called conditionally.

[Andarist]

It's safe as long as you obey the rules of hooks. You need to call always the same hooks in your styled components (each render)

[matt-tingen]

Great, thanks!