Remove style guide and use relative paths for tests

.babelrc

@@ -4,65 +4,7 @@
  "react"
  ],
  "plugins": [
- "transform-object-rest-spread",
- ["module-resolver", {
- "alias": {
- "cf-builder-card": "./packages/cf-builder-card/src/index.js",
- "cf-builder-pagination": "./packages/cf-builder-pagination/src/index.js",
- "cf-builder-table": "./packages/cf-builder-table/src/index.js",
- "cf-component-button": "./packages/cf-component-button/src/index.js",
- "cf-component-callout": "./packages/cf-component-callout/src/index.js",
- "cf-component-card": "./packages/cf-component-card/src/index.js",
- "cf-component-checkbox": "./packages/cf-component-checkbox/src/index.js",
- "cf-component-code": "./packages/cf-component-code/src/index.js",
- "cf-component-copyable-textarea": "./packages/cf-component-copyable-textarea/src/index.js",
- "cf-component-dropdown": "./packages/cf-component-dropdown/src/index.js",
- "cf-component-dynamic-content": "./packages/cf-component-dynamic-content/src/index.js",
- "cf-component-flex": "./packages/cf-component-flex/src/index.js",
- "cf-component-form": "./packages/cf-component-form/src/index.js",
- "cf-component-heading": "./packages/cf-component-heading/src/index.js",
- "cf-component-icon": "./packages/cf-component-icon/src/index.js",
- "cf-component-input": "./packages/cf-component-input/src/index.js",
- "cf-component-label": "./packages/cf-component-label/src/index.js",
- "cf-component-layout": "./packages/cf-component-layout/src/index.js",
- "cf-component-link": "./packages/cf-component-link/src/index.js",
- "cf-component-list": "./packages/cf-component-list/src/index.js",
- "cf-component-loading": "./packages/cf-component-loading/src/index.js",
- "cf-component-modal": "./packages/cf-component-modal/src/index.js",
- "cf-component-notifications": "./packages/cf-component-notifications/src/index.js",
- "cf-component-page": "./packages/cf-component-page/src/index.js",
- "cf-component-pagination": "./packages/cf-component-pagination/src/index.js",
- "cf-component-progress": "./packages/cf-component-progress/src/index.js",
- "cf-component-radio": "./packages/cf-component-radio/src/index.js",
- "cf-component-select": "./packages/cf-component-select/src/index.js",
- "cf-component-table": "./packages/cf-component-table/src/index.js",
- "cf-component-tabs": "./packages/cf-component-tabs/src/index.js",
- "cf-component-text": "./packages/cf-component-text/src/index.js",
- "cf-component-textarea": "./packages/cf-component-textarea/src/index.js",
- "cf-component-toggle": "./packages/cf-component-toggle/src/index.js",
- "cf-component-tooltip": "./packages/cf-component-tooltip/src/index.js",
- "cf-component-typography": "./packages/cf-component-typography/src/index.js",
- "cf-component-viewport": "./packages/cf-component-viewport/src/index.js",
- "cf-pony": "./packages/cf-pony/src/index.js",
- "cf-style-const": "./packages/cf-style-const/src/index.js",
- "cf-style-container": "./packages/cf-style-container/src/index.js",
- "cf-test-focus": "./packages/cf-test-focus/src/index.js",
- "cf-test-server": "./packages/cf-test-server/src/index.js",
- "cf-test-store": "./packages/cf-test-store/src/index.js",
- "cf-test-stub": "./packages/cf-test-stub/src/index.js",
- "cf-test-www-api": "./packages/cf-test-www-api/src/index.js",
- "cf-util-adwords": "./packages/cf-util-adwords/src/index.js",
- "cf-util-async": "./packages/cf-util-async/src/index.js",
- "cf-util-cache": "./packages/cf-util-cache/src/index.js",
- "cf-util-http": "./packages/cf-util-http/src/index.js",
- "cf-util-http-file": "./packages/cf-util-http-file/src/index.js",
- "cf-util-http-poll": "./packages/cf-util-http-poll/src/index.js",
- "cf-util-logger": "./packages/cf-util-logger/src/index.js",
- "cf-util-markdown": "./packages/cf-util-markdown/src/index.js",
- "cf-util-route-handler": "./packages/cf-util-route-handler/src/index.js",
- "cf-util-text": "./packages/cf-util-text/src/index.js"
- }
- }]
+ "transform-object-rest-spread"
  ],
  "env": {
  "commonjs": {

.travis.yml

@@ -13,7 +13,6 @@ addons:
 before_script:
  - npm run bootstrap
 script:
+ - npm run build
  - npm run lint
  - npm test
- - npm run build:styleguide
- - npm run build

CONTRIBUTING.md

@@ -25,39 +25,13 @@ npm run prettier # Reformats the whole JS codebase, look for an on-save integrat
 npm test # Run the tests
 npm test -- --testPathPattern cf-component-button # Run the tests on a single package
 npm test -- --watchAll # Run the tests in watch mode
-npm run gen # Autogenerate the style guide (imports all components into one page)
 ```
 
-## Style Guide
-
-### To build
-
-```sh
-npm run build:styleguide
-open docs/index.html
-```
-
-### To work continuously
-
-```sh
-npm start
-open http://localhost:8000
-```
-
-### To publish
-
-```sh
-npm run build:styleguide
-```
-
-and commit the changed `/docs` folder.
-
 ## Publishing packages
 
 cf-ui uses [Lerna](https://lernajs.io) in order to publish new versions of
 packages.
 
-
 ```sh
 npm run publish
 ```

README.md

@@ -7,7 +7,6 @@ projects such as [React](https://facebook.github.io/react/),
 [Redux](http://redux.js.org), [npm](https://www.npmjs.com),
 [Lerna](https://lernajs.io), and more.
 
-
 ## Important note
 
 We are currently migrating cf-ui to CSS in JS using [Fela](https:/rofrischmann/fela). That means that our components will include styles so you can use them out of the box! However, you need to start using Fela in your project. No worries, [it's pretty easy](http://fela.js.org/)! We will share more exciting info once the migration is done. So far, these components are migrated:
@@ -25,13 +24,6 @@ npm install
 npm run bootstrap
 ```
 
-## Viewing the Style Guide
-
-```bash
-npm run build:styleguide
-open docs/index.html
-```
-
 To view all of the available packages, see the [`packages/` directory](packages).
 
 ## Contributing

package.json

@@ -15,17 +15,12 @@
  "build": "./scripts/build.sh && npm run build:umd && npm run build:umd:min",
  "build:umd": "cross-env BABEL_ENV=commonjs NODE_ENV=development webpack --config webpack.babel.js",
  "build:umd:min": "cross-env BABEL_ENV=commonjs NODE_ENV=production webpack --config webpack.babel.js",
- "build:styleguide": "rimraf docs && cross-env BABEL_ENV=commonjs NODE_ENV=production webpack --config styleguide/config.prod.babel.js && rm docs/static-*",
- "lint": "eslint packages/*/src/**/*.js packages/*/example/**/*.js packages/*/test/**/*.js styleguide *.js || true",
+ "lint": "eslint packages/*/src/**/*.js packages/*/example/**/*.js packages/*/test/**/*.js || true",
  "test": "cross-env BABEL_ENV=commonjs jest",
  "updated": "lerna updated --only-explicit-updates",
  "prettier": "node prettier.js",
- "clean": "lerna clean --yes && rimraf .jest dist",
+ "clean": "lerna clean --yes && rimraf .jest",
  "publish": "git pull --rebase && check-installed-dependencies && npm run build && lerna publish --only-explicit-updates",
- "start": "npm run start:devserver | npm run start:server",
- "start:devserver": "cross-env BABEL_ENV=commonjs node styleguide/server.dev.hook",
- "start:server": "cross-env BABEL_ENV=commonjs NODE_ENV=development node styleguide/server.hook",
- "gen": "node ./styleguide/generateList",
  "update-snapshot": "cross-env BABEL_ENV=commonjs jest --no-cache --updateSnapshot"
  },
  "devDependencies": {
@@ -35,22 +30,16 @@
  "babel-eslint": "^7.1.1",
  "babel-jest": "^19.0.0",
  "babel-loader": "7.0.0-alpha.3",
- "babel-plugin-module-resolver": "^2.5.0",
  "babel-plugin-transform-es2015-modules-commonjs": "^6.23.0",
  "babel-plugin-transform-object-rest-spread": "^6.18.0",
  "babel-preset-es2015": "^6.18.0",
  "babel-preset-react": "^6.16.0",
- "babel-register": "^6.23.0",
  "check-installed-dependencies": "^1.0.0",
- "compression": "^1.6.2",
  "cross-env": "^3.2.3",
- "css-loader": "^0.26.4",
  "enzyme": "^2.7.1",
  "enzyme-to-json": "^1.5.0",
  "eslint": "^3.17.1",
  "eslint-plugin-prettier": "^2.0.1",
- "express": "^4.15.2",
- "extract-text-webpack-plugin": "^2.1.0",
  "fela": "^4.2.6",
  "fela-beautifier": "^4.2.6",
  "fela-font-renderer": "^4.2.6",
@@ -62,13 +51,10 @@
  "fela-plugin-validator": "^4.2.6",
  "file-loader": "^0.10.1",
  "glob": "^7.0.3",
- "highlight-loader": "^0.7.2",
- "ip": "^1.1.5",
  "jest": "^19.0.2",
  "jsdom": "^9.11.0",
  "lerna": "2.0.0-beta.38",
  "prettier": "^0.22.0",
- "progress-bar-webpack-plugin": "^1.9.3",
  "react": "^15.0.0-0",
  "react-addons-css-transition-group": "^15.0.0-0",
  "react-addons-test-utils": "^15.4.2",
@@ -80,11 +66,6 @@
  "redux-thunk": "^2.2.0",
  "rimraf": "^2.6.1",
  "sinon": "^2.0.0-pre.6",
- "static-site-generator-webpack-plugin": "^3.3.0",
- "style-loader": "^0.13.2",
- "url-loader": "^0.5.8",
- "webpack": "^2.2.1",
- "webpack-dev-middleware": "^1.10.1",
- "webpack-hot-middleware": "^2.17.1"
+ "webpack": "^2.2.1"
  }
 }

packages/cf-builder-card/test/cardActions.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { createMockStore } from 'cf-test-store';
-import { cardActions, CardActionTypes } from 'cf-builder-card';
+import { createMockStore } from '../../cf-test-store/src/index';
+import { cardActions, CardActionTypes } from '../../cf-builder-card/src/index';
 
 test('.toggleDrawer() should create an action', () => {
  const store = createMockStore();

packages/cf-builder-card/test/cardBuilder.js

@@ -2,7 +2,11 @@ import React from 'react';
 import renderer from 'react-test-renderer';
 import { createStore, combineReducers } from 'redux';
 import { Provider } from 'react-redux';
-import { cardActions, cardReducer, CardBuilder } from 'cf-builder-card';
+import {
+ cardActions,
+ cardReducer,
+ CardBuilder
+} from '../../cf-builder-card/src/index';
 import { mount } from 'enzyme';
 
 let store;

packages/cf-builder-card/test/cardReducer.js

@@ -1,4 +1,4 @@
-import { cardReducer, CardActionTypes } from 'cf-builder-card';
+import { cardReducer, CardActionTypes } from '../../cf-builder-card/src/index';
 
 test('should have initial state', () => {
  expect(cardReducer(undefined, {})).toEqual({});

packages/cf-builder-pagination/test/PaginationBuilder.js

@@ -1,9 +1,8 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
 import { mount } from 'enzyme';
-import { PaginationBuilder } from 'cf-builder-pagination';
-import { PaginationItem } from 'cf-component-pagination';
-import { createStub } from 'cf-test-stub';
+import { PaginationBuilder } from '../../cf-builder-pagination/src/index';
+import { createStub } from '../../cf-test-stub/src/index';
 
 test('should render pagination', () => {
  const component = renderer.create(
@@ -86,7 +85,7 @@ test('should should call onPageChange when clicking another page', () => {
  />
  );
 
- const items = wrapper.find(PaginationItem);
+ const items = wrapper.find('li');
 
  items.at(2).find('a').simulate('click');
  expect(onPageChange.called).toBeTruthy();

packages/cf-builder-table/test/TableBuilder.js

@@ -4,8 +4,17 @@ import { mount } from 'enzyme';
 import { createStore, combineReducers, applyMiddleware } from 'redux';
 import thunk from 'redux-thunk';
 import { Provider } from 'react-redux';
-import { tableActions, tableReducer, TableBuilder } from 'cf-builder-table';
-import { Table, TableBody, TableRow, TableCell } from 'cf-component-table';
+import {
+ tableActions,
+ tableReducer,
+ TableBuilder
+} from '../../cf-builder-table/src/index';
+import {
+ Table,
+ TableBody,
+ TableRow,
+ TableCell
+} from '../../cf-component-table/src/index';
 
 let store;
 
@@ -101,6 +110,6 @@ test('should support flashes', () => {
  </Provider>
  );
  store.dispatch(tableActions.flashRow('test-table', '1', 'success'));
- const row = wrapper.find(TableBody).find(TableRow).at(0);
- expect(row.prop('type')).toBe('success');
+ const row = wrapper.find('tbody').find('tr').at(0);
+ expect(row.prop('className')).toBe('cf-table__row cf-table__row--success');
 });

packages/cf-builder-table/test/tableActions.js

@@ -1,7 +1,11 @@
-import { createMockStore } from 'cf-test-store';
-import cf from 'cf-pony';
-import { tableActions, TableActionTypes } from 'cf-builder-table';
+import { createMockStore } from '../../cf-test-store/src/index';
+import cf from '../../cf-pony/src/index';
+import {
+ tableActions,
+ TableActionTypes
+} from '../../cf-builder-table/src/index';
 
+// this test is flaky, in 1/4 cases it just time outs
 test('.flashRow() should dispatch actions for flashing the row', done => {
  const store = createMockStore();
  const tableName = 'TEST_TABLE_NAME';

packages/cf-builder-table/test/tableReducer.js

@@ -1,4 +1,7 @@
-import { tableReducer, TableActionTypes } from 'cf-builder-table';
+import {
+ tableReducer,
+ TableActionTypes
+} from '../../cf-builder-table/src/index';
 
 test('should have initial state', () => {
  expect(tableReducer(undefined, {})).toEqual({});

packages/cf-component-button/package.json

@@ -11,6 +11,7 @@
  "registry": "http://registry.npmjs.org/"
  },
  "dependencies": {
+ "cf-style-const": "^0.0.1",
  "cf-style-container": "^0.0.2"
  },
  "peerDependencies": {

packages/cf-component-button/test/Button.js

@@ -1,8 +1,11 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import felaTestContext from '../../../styleguide/felaTestContext';
-import { applyTheme } from 'cf-style-container';
-import { Button as ButtonUnstyled, ButtonTheme } from 'cf-component-button';
+import felaTestContext from '../../../felaTestContext';
+import { applyTheme } from '../../cf-style-container/src/index';
+import {
+ Button as ButtonUnstyled,
+ ButtonTheme
+} from '../../cf-component-button/src/index';
 
 const Button = applyTheme(ButtonUnstyled, ButtonTheme);
 

packages/cf-component-button/test/ButtonGroup.js

@@ -1,13 +1,13 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import felaTestContext from '../../../styleguide/felaTestContext';
-import { applyTheme } from 'cf-style-container';
+import felaTestContext from '../../../felaTestContext';
+import { applyTheme } from '../../cf-style-container/src/index';
 import {
  ButtonGroup as ButtonGroupUnstyled,
  ButtonGroupTheme,
  Button as ButtonUnstyled,
  ButtonTheme
-} from 'cf-component-button';
+} from '../../cf-component-button/src/index';
 
 const Button = applyTheme(ButtonUnstyled, ButtonTheme);
 const ButtonGroup = applyTheme(ButtonGroupUnstyled, ButtonGroupTheme);

packages/cf-component-callout/test/Callout.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import Callout from 'cf-component-callout';
+import Callout from '../../cf-component-callout/src/index';
 
 test('should render "default" by default', () => {
  const component = renderer.create(

packages/cf-component-card/test/Card.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { Card } from 'cf-component-card';
+import { Card } from '../../cf-component-card/src/index';
 
 test('should render', () => {
  const component = renderer.create(<Card>Card</Card>);

packages/cf-component-card/test/CardBlock.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { CardBlock } from 'cf-component-card';
+import { CardBlock } from '../../cf-component-card/src/index';
 
 test('should render', () => {
  const component = renderer.create(<CardBlock>CardBlock</CardBlock>);

packages/cf-component-card/test/CardContent.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { CardContent } from 'cf-component-card';
+import { CardContent } from '../../cf-component-card/src/index';
 
 test('should render without footer message', () => {
  const component = renderer.create(

packages/cf-component-card/test/CardControl.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { CardControl } from 'cf-component-card';
+import { CardControl } from '../../cf-component-card/src/index';
 
 test('should render', () => {
  const component = renderer.create(<CardControl>CardControl</CardControl>);