React Rainbow UI example missing theme

Question

I'm trying to test the sidebar example from rainbow ui (https://react-rainbow.io/#/Sidebar)

    const SideBarContainer = styled.div.attrs(props => {
        return props.theme.rainbow.palette;
    })

But I'm getting the error that props.theme.rainbow.palette is unresolved. How can I fix this?

Answer 1

As I explain on my comment you need to wrap your react app in a Applicationcomponent like explain in the Like it's explain in the doc from React Rainbow :

export default function App() {
  return (
    <div className="App">
      <Application>
        <Header />
      </Application>
    </div>
  );
}

I made a code SandBox of the React Rainbow sideBar demo that I pass in functional components: