use webpack for all builds

packages/netlify-cms-ui-default/babel.config.js

@@ -0,0 +1,3 @@
+const config = require('../../babel.config.js');
+
+module.exports = config;

packages/netlify-cms-ui-default/package.json

@@ -3,29 +3,33 @@
   "description": "Default UI components for Netlify CMS.",
   "version": "2.0.0-alpha.0",
   "license": "MIT",
-  "main": "index.js",
+  "main": "dist/netlify-cms-ui-default.js",
   "keywords": [
     "netlify-cms"
   ],
+  "sideEffects": false,
   "scripts": {
-    "watch": "parcel watch src/*.js --out-dir . --no-cache",
-    "build": "parcel build src/*.js --out-dir . --no-cache"
+    "watch": "webpack -w",
+    "build": "cross-env NODE_ENV=production webpack"
   },
   "dependencies": {
-    "classnames": "^2.2.5",
-    "emotion": "^9.1.3",
-    "lodash": "^4.13.1",
-    "prop-types": "^15.5.10",
-    "react": "^16.4.1",
     "react-aria-menubutton": "^5.1.0",
-    "react-emotion": "^9.2.6",
     "react-toggled": "^1.1.2",
     "react-transition-group": "^2.2.1"
   },
   "devDependencies": {
-    "babel-cli": "^6.26.0",
-    "babel-core": "^6.26.3",
-    "babel-plugin-inline-svg": "^1.0.0",
-    "parcel-bundler": "^1.9.4"
+    "@babel/cli": "^7.0.0-beta.54",
+    "@babel/core": "^7.0.0-beta.54",
+    "cross-env": "^5.2.0",
+    "rollup": "^0.63.2",
+    "rollup-plugin-babel": "^4.0.0-beta.7",
+    "webpack": "^4.16.1",
+    "webpack-cli": "^3.1.0"
+  },
+  "peerDependencies": {
+    "lodash": "^4.13.1",
+    "prop-types": "^15.5.10",
+    "react": "^16.4.1",
+    "react-emotion": "^9.2.6"
   }
 }

packages/netlify-cms-ui-default/src/index.js

@@ -0,0 +1,16 @@
+export Dropdown, { DropdownItem, DropdownButton, StyledDropdownButton } from './Dropdown';
+export Icon from './Icon';
+export ListItemTopBar from './ListItemTopBar';
+export Loader from './Loader';
+export Toggle from './Toggle';
+export {
+  fonts,
+  colorsRaw,
+  colors,
+  lengths,
+  components,
+  buttons,
+  shadows,
+  borders,
+  transitions,
+} from './styles';

packages/netlify-cms-ui-default/src/styles.js

@@ -1,9 +1,21 @@
 import { css, injectGlobal } from 'react-emotion';
 
+export {
+  fonts,
+  colorsRaw,
+  colors,
+  lengths,
+  components,
+  buttons,
+  shadows,
+  borders,
+  transitions,
+};
+
 /**
  * Font Stacks
  */
-export const fonts = {
+const fonts = {
   primary: `
     -apple-system,
     BlinkMacSystemFont,
@@ -29,7 +41,7 @@ export const fonts = {
 /**
  * Theme Colors
  */
-export const colorsRaw = {
+const colorsRaw = {
   white: '#fff',
   grayLight: '#eff0f4',
   gray: '#798291',
@@ -48,7 +60,7 @@ export const colorsRaw = {
   tealLight: '#ddf5f9',
 };
 
-export const colors = {
+const colors = {
   statusDraftText: colorsRaw.purple,
   statusDraftBackground: colorsRaw.purpleLight,
   statusReviewText: colorsRaw.Brown,
@@ -78,7 +90,7 @@ export const colors = {
   controlLabel: '#7a8291',
 };
 
-export const lengths = {
+const lengths = {
   topBarHeight: '56px',
   inputPadding: '16px 20px',
   borderRadius: '5px',
@@ -88,15 +100,15 @@ export const lengths = {
   pageMargin: '84px 18px',
 };
 
-export const borders = {
+const borders = {
   textField: `solid  ${lengths.borderWidth} ${colors.textFieldBorder}`,
 };
 
-export const transitions = {
+const transitions = {
   main: '.2s ease',
 };
 
-export const shadows = {
+const shadows = {
   drop: css`
     box-shadow: 0 2px 4px 0  rgba(19, 39, 48, .12);
   `,
@@ -129,7 +141,7 @@ const card = css`
   background-color: #fff;
 `;
 
-export const buttons = {
+const buttons = {
   button: css`
     border: 0;
     border-radius: ${lengths.borderRadius};
@@ -191,7 +203,7 @@ export const buttons = {
   `,
 };
 
-export const components = {
+const components = {
   card,
   caretDown: css`
     color: ${colorsRaw.white};

packages/netlify-cms-ui-default/webpack.config.js

@@ -0,0 +1 @@
+module.exports = require('../../webpack.config.js');