Usage With Other Tools

babel-plugin-emotion

In order to use components as selectors in Emotion you need to install babel_plugin_emotion. Interactive components works well as selectors too:

const A = interactive(styled.a`
  color: pink;
  ...
`)
// That works fine 👍
const Wrapper = interactive(styled.div`
  ${A} {
    color: green;
  }
  ...
`)

React Spring

Styled Benefits works fine with React Spring. Just keep the order of functions:

const Animated = interactive(styled(animated.div)`
 ...
`)

Framer Motion

Above rules applies to Framer Motion:

const Motion = interactive(styled(motion.div)`
 ...
`)

Linaria

Styled Benefits won't work with Linaria. Currently Styled Benefits works only with styled-components / Emotion. It needs access to styled component object which is not present in Linaria