AppBar is not css'ed

[idangozlan]

I'm pretty sure that I've missed something since there's no anything about that over Google.

Anyway, when im trying to use AppBar, im getting non css'ed AppBar, created using create-react-app :

import React, { Component } from 'react';
import AppBar from 'react-toolbox/lib/app_bar/AppBar';

App.js
class App extends Component {
  render() {
    return (
      <div className="App">
        <AppBar title="React Toolbox" />
      </div>
    );
  }
}

export default App;

index.js

import React from 'react';
import ReactDOM from 'react-dom';
import ThemeProvider from 'react-toolbox/lib/ThemeProvider';

import theme from './assets/react-toolbox/theme'
import App from './App';
import registerServiceWorker from './registerServiceWorker';
import './assets/react-toolbox/theme.css';
import './index.css';

ReactDOM.render(
  <ThemeProvider theme={theme}>
    <App />
  </ThemeProvider>,
  document.getElementById('root')
);
registerServiceWorker();

package.json:

{
  "name": "jsfs",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^15.5.4",
    "react-dom": "^15.5.4",
    "react-toolbox": "^2.0.0-beta.11",
    "react-toolbox-themr": "^1.0.2"
  },
  "devDependencies": {
    "react-scripts": "1.0.6"
  },
  "reactToolbox": {
    "include": [
      "BUTTON",
      "DATE_PICKER"
    ],
    "customProperties": {
      "animation-duration": "0.3s",
      "color-accent": "var(--palette-pink-a200)",
      "color-accent-dark": "var(--palette-pink-700)",
      "color-primary-contrast": "var(--color-dark-contrast)",
      "color-accent-contrast": "var(--color-dark-contrast)"
    },
    "output": "src/assets/react-toolbox"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject",
    "toolbox": "react-toolbox-themr"
  }
}

[tarnasky]

@idangozlan You need to include "APP_BAR" in your package.json like this:

  "reactToolbox": {
    "include": [
      "APP_BAR",
      "BUTTON",
      "DATE_PICKER"
    ],

That isn't documented in the README, but I found it here:

https://github.com/react-toolbox/react-toolbox-themr/blob/master/src/constants.js#L20

[idangozlan]

Thanks :) I've created pull request with a new Readme file that includes also the appbar, so others will be able see that.