react-toolbox / react-toolbox-themr

A tool to statically extract and generate custom themes for React Toolbox
MIT License
240 stars 24 forks source link

Layout (sub)components do not respect theme provided by `ThemeProvider` #35

Open leonth opened 7 years ago

leonth commented 7 years ago

After following the instructions in the README (setting up ThemeProvider), this does not work:

import * as React from 'react'
import { Layout } from 'react-toolbox/lib/layout/Layout'
import { NavDrawer } from 'react-toolbox/lib/layout/NavDrawer'
import { Panel } from 'react-toolbox/lib/layout/Panel'

export default function({ children }) {
  return (
    <Layout>
      <NavDrawer>[nav here]</NavDrawer>
      <Panel>
        {children}
      </Panel>
    </Layout>
  )
}

However, this works / renders correctly:

import * as React from 'react'
import { Layout } from 'react-toolbox/lib/layout/Layout'
import { NavDrawer } from 'react-toolbox/lib/layout/NavDrawer'
import { Panel } from 'react-toolbox/lib/layout/Panel'
import * as theme from '../react-toolbox/theme'

export default function({ children }) {
  return (
    <Layout theme={theme}>
      <NavDrawer theme={theme}>[nav here]</NavDrawer>
      <Panel theme={theme}>
        {children}
      </Panel>
    </Layout>
  )
}

It seems to only affect Layout components - at least AppBar and Button does not have this issue.