add css generating script and package.json hook

Author: Philip Weiss

initialize.js

@@ -0,0 +1,2 @@
+// eslint-disable-next-line import/no-unresolved
+require('./lib/initialize');

package.json

@@ -14,8 +14,7 @@
     "prepublish": "in-publish && safe-publish-latest && npm run build || not-in-publish",
     "lint": "eslint --ext .js,.jsx src test stories",
     "storybook": "start-storybook -p 9001",
-    "prestorybook:css": "npm run build:css",
-    "storybook:css": "start-storybook -p 6006 -c .storybook-css",
+    "storybook:css": "npm run build:css && start-storybook -p 6006 -c .storybook-css",
     "pretest": "npm run build && npm run lint",
     "test": "nyc npm run test:all",
     "tests-only": "npm run test:all",

src/DefaultBackground.jsx

@@ -36,7 +36,7 @@ DefaultBackground.defaultProps = defaultProps;
 
 export default withStyles(({ color, unit }) => ({
   DefaultBackground_background: {
-    backgroundColor: color.white,
+    backgroundColor: 'color.white',
     border: `5px solid ${color.grey}`,
     position: 'relative',
   },

src/initialize.js

@@ -0,0 +1,3 @@
+import registerCSSInterfaceWithDefaultTheme from '../scripts/utils/registerCSSInterfaceWithDefaultTheme';
+
+registerCSSInterfaceWithDefaultTheme();