GitHub/storybook
1
0
Fork 0
mirror of https://github.com/storybookjs/storybook.git synced 2025-03-20 05:02:37 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add dist directory, if someone loading the package via GH

Browse Source
This commit is contained in:
Arunoda Susiripala 2016-04-06 03:45:25 +05:30
parent 92cb3fa26f
commit b110b2750e
27 changed files with 2823 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored
View File

@ -1,3 +1,2 @@
dist
node_modules
*.log

12
dist/client/__tests__/_utils.js vendored Normal file
View File

@ -0,0 +1,12 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.setWindow = setWindow;
function setWindow(search) {
global.window = {
location: { search: search },
addEventListener: function addEventListener() {}
};
}

156
dist/client/__tests__/client_api.js vendored Normal file
View File

@ -0,0 +1,156 @@
'use strict';
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _typeof2 = require('babel-runtime/helpers/typeof');
var _typeof3 = _interopRequireDefault(_typeof2);
var _chai = require('chai');
var _client_api = require('../client_api');
var _client_api2 = _interopRequireDefault(_client_api);
var _sinon = require('sinon');
var _sinon2 = _interopRequireDefault(_sinon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _global = global;
var describe = _global.describe;
var it = _global.it;
function getClientApi() {
var syncedStore = { aa: 30 };
var storyStore = { aa: 10 };
var api = new _client_api2.default({ syncedStore: syncedStore, storyStore: storyStore });
return api;
}
describe('client.ClientApi', function () {
describe('constructor', function () {
it('should set _syncedStore & _storyStore properly', function () {
var syncedStore = { aa: 30 };
var storyStore = { aa: 10 };
var api = new _client_api2.default({ syncedStore: syncedStore, storyStore: storyStore });
(0, _chai.expect)(api._syncedStore).to.be.equal(syncedStore);
(0, _chai.expect)(api._storyStore).to.be.equal(storyStore);
});
});
describe('storiesOf', function () {
it('should return an api where we can add stories', function () {
var api = getClientApi();
var chainApi = api.storiesOf('kind');
(0, _chai.expect)((0, _typeof3.default)(chainApi.add)).to.be.equal('function');
});
it('should remove story of the given kind, when hot module is disposing', function () {
var doDispose = null;
var hotModule = {
hot: {
dispose: function dispose(fn) {
doDispose = fn;
}
}
};
var api = getClientApi();
api._storyStore.removeStoryKind = _sinon2.default.stub();
api.storiesOf('kind', hotModule);
doDispose();
(0, _chai.expect)(api._storyStore.removeStoryKind.args[0][0]).to.be.equal('kind');
});
});
describe('storiesOf.add', function () {
it('should add a given story', function () {
var api = getClientApi();
var handle = function handle() {};
api._storyStore.addStory = _sinon2.default.stub();
api.storiesOf('kind').add('name', handle);
var args = api._storyStore.addStory.args[0];
(0, _chai.expect)(args[0]).to.be.equal('kind');
(0, _chai.expect)(args[1]).to.be.equal('name');
(0, _chai.expect)(args[2]).to.be.equal(handle);
});
it('should support method chaining', function () {
var api = getClientApi();
var handle = function handle() {};
api._storyStore.addStory = _sinon2.default.stub();
api.storiesOf('kind').add('name', handle).add('name2', handle);
});
});
describe('action', function () {
it('should send action info to the syncedStore', function () {
var api = getClientApi();
api._syncedStore.getData = function () {
return { actions: [] };
};
api._syncedStore.setData = _sinon2.default.stub();
var cb = api.action('hello');
cb(10, 20);
var args = api._syncedStore.setData.args[0];
(0, _chai.expect)(args[0].actions).to.be.deep.equal([{
name: 'hello',
args: [10, 20]
}]);
});
it('should only keep the latest 5 actions in the syncedStore', function () {
var api = getClientApi();
api._syncedStore.getData = function () {
return {
actions: [50, 40, 30, 20, 10]
};
};
api._syncedStore.setData = _sinon2.default.stub();
var cb = api.action('hello');
cb(10, 20);
var args = api._syncedStore.setData.args[0];
(0, _chai.expect)(args[0].actions).to.be.deep.equal([{
name: 'hello',
args: [10, 20]
}, 50, 40, 30, 20]);
});
it('should replace any Synthetic Event with it\'s name', function () {
var api = getClientApi();
api._syncedStore.getData = function () {
return { actions: [] };
};
api._syncedStore.setData = _sinon2.default.stub();
var SyntheticAction = function SyntheticAction() {
(0, _classCallCheck3.default)(this, SyntheticAction);
};
var cb = api.action('hello');
cb(new SyntheticAction());
var args = api._syncedStore.setData.args[0];
(0, _chai.expect)(args[0].actions).to.be.deep.equal([{
name: 'hello',
args: ['[SyntheticAction]']
}]);
});
});
});

226
dist/client/__tests__/config_api.js vendored Normal file
View File

@ -0,0 +1,226 @@
'use strict';
var _chai = require('chai');
var _sinon = require('sinon');
var _sinon2 = _interopRequireDefault(_sinon);
var _config_api = require('../config_api');
var _config_api2 = _interopRequireDefault(_config_api);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _global = global;
var describe = _global.describe;
var it = _global.it;
function buildMock(fields) {
var obj = {};
fields.forEach(function (field) {
obj[field] = _sinon2.default.stub();
});
return obj;
}
function getConfigApi() {
var storyStore = buildMock(['addStory', 'removeStoryKind', 'clean', 'hasStoryKind', 'dumpStoryBook', 'getStoryKinds', 'hasStory', 'getStories']);
storyStore.hasStoryKind = function () {
return true;
};
storyStore.hasStory = function () {
return true;
};
var syncedStore = buildMock(['setData']);
syncedStore.getData = function () {
return {};
};
var c = new _config_api2.default({
syncedStore: syncedStore,
storyStore: storyStore
});
return c;
}
describe('client.ConfigApi', function () {
describe('_renderError', function () {
it('should send error stack and message to syncedStore', function () {
var api = getConfigApi();
api._syncedStore.getData = function () {
return {};
};
var message = 'the-message';
var stack = 'the-stack';
var error = new Error(message);
error.stack = stack;
api._renderError(error);
var capturedError = api._syncedStore.setData.args[0][0].error;
(0, _chai.expect)(capturedError).to.deep.equal({ message: message, stack: stack });
});
});
describe('_renderMain', function () {
it('should run loaders if provided', function (done) {
var api = getConfigApi();
var loaders = done;
api._renderMain(loaders);
});
it('should set error in syncedStore to null', function () {
var api = getConfigApi();
api._syncedStore.getData = function () {
return { error: 'something-else' };
};
api._renderMain();
var data = api._syncedStore.setData.args[0][0];
(0, _chai.expect)(data.error).to.be.equal(null);
});
it('should get a dump of storyStore and send it to syncedStore', function () {
var api = getConfigApi();
var dump = { aa: 10 };
api._storyStore.dumpStoryBook = function () {
return dump;
};
api._renderMain();
var data = api._syncedStore.setData.args[0][0];
(0, _chai.expect)(data.storyStore).to.deep.equal(dump);
});
it('should set __updatedAt field with a updated value to syncedStore', function () {
it('should get a dump of storyStore and send it to syncedStore', function () {
var api = getConfigApi();
api._renderMain();
var data = api._syncedStore.setData.args[0][0];
(0, _chai.expect)(data.__updatedAt <= Date.now()).to.deep.equal(true);
});
});
it('should select a new kind if the current one is not available', function () {
var api = getConfigApi();
api._storyStore.hasStoryKind = function () {
return false;
};
api._storyStore.getStoryKinds = function () {
return ['abc'];
};
api._renderMain();
var data = api._syncedStore.setData.args[0][0];
(0, _chai.expect)(data.selectedKind).to.deep.equal('abc');
});
describe('if there is kind', function () {
it('should select a new story if the current one is not available', function () {
var api = getConfigApi();
api._storyStore.hasStoryKind = function () {
return true;
};
api._storyStore.hasStory = function () {
return false;
};
api._storyStore.getStories = function () {
return ['kkr'];
};
api._renderMain();
var data = api._syncedStore.setData.args[0][0];
(0, _chai.expect)(data.selectedStory).to.deep.equal('kkr');
});
});
});
describe('configure', function () {
describe('initially', function () {
it('should call _renderMain with loaders', function () {
var api = getConfigApi();
api._renderMain = _sinon2.default.stub();
var loaders = function loaders() {};
var m = {};
api.configure(loaders, m);
(0, _chai.expect)(api._renderMain.args[0][0]).to.be.equal(loaders);
});
describe('if caused an error', function () {
it('should call _renderError with the error', function () {
var api = getConfigApi();
var error = new Error('horra');
api._renderMain = function () {
throw error;
};
api._renderError = _sinon2.default.stub();
var loaders = function loaders() {};
var m = {};
api.configure(loaders, m);
(0, _chai.expect)(api._renderError.args[0][0]).to.be.equal(error);
});
});
});
describe('with hot reload', function () {
it('should call _renderMain with loaders', function (done) {
var api = getConfigApi();
api._renderMain = _sinon2.default.stub();
var doAccept = null;
var m = {
hot: {
accept: function accept(fn) {
doAccept = fn;
}
}
};
api.configure(null, m);
doAccept();
setTimeout(function () {
(0, _chai.expect)(api._renderMain.callCount).to.be.equal(2);
done();
}, 10);
});
describe('if caused an error', function () {
it('should call _renderError with the error', function (done) {
var error = new Error('error');
var api = getConfigApi();
api._renderMain = function () {
throw error;
};
api._renderError = _sinon2.default.stub();
var doAccept = null;
var m = {
hot: {
accept: function accept(fn) {
doAccept = fn;
}
}
};
api.configure(null, m);
doAccept();
setTimeout(function () {
(0, _chai.expect)(api._renderError.callCount).to.be.equal(2);
done();
}, 10);
});
});
});
});
});

228
dist/client/__tests__/data.js vendored Normal file
View File

@ -0,0 +1,228 @@
'use strict';
var _extends2 = require('babel-runtime/helpers/extends');
var _extends3 = _interopRequireDefault(_extends2);
var _stringify = require('babel-runtime/core-js/json/stringify');
var _stringify2 = _interopRequireDefault(_stringify);
var _typeof2 = require('babel-runtime/helpers/typeof');
var _typeof3 = _interopRequireDefault(_typeof2);
var _uuid = require('uuid');
var _uuid2 = _interopRequireDefault(_uuid);
var _sinon = require('sinon');
var _sinon2 = _interopRequireDefault(_sinon);
var _chai = require('chai');
var _synced_store = require('../synced_store');
var _synced_store2 = _interopRequireDefault(_synced_store);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _global = global;
var describe = _global.describe;
var it = _global.it;
function getSyncedData(dataId) {
var window = {
location: {},
addEventListener: function addEventListener() {}
};
if (dataId) {
window.location.search = '?dataId=' + dataId;
}
var syncedData = new _synced_store2.default(window);
syncedData._bus = {};
return syncedData;
}
describe('data', function () {
describe('normal mode', function () {
it('should set the `iframeMode` as false', function () {
var syncedData = getSyncedData();
var data = syncedData.getData();
(0, _chai.expect)(data.iframeMode).to.be.equal(false);
});
it('should set a random Id to dataId', function () {
var syncedData = getSyncedData();
var data = syncedData.getData();
(0, _chai.expect)((0, _typeof3.default)(data.dataId)).to.be.equal('string');
});
});
describe('iframe mode', function () {
it('should get the dataId from the URL', function () {
var currentDataId = _uuid2.default.v4();
var syncedData = getSyncedData(currentDataId);
var data = syncedData.getData();
(0, _chai.expect)(data.dataId).to.be.equal(currentDataId);
});
it('should set the iframeMode as true', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var data = syncedData.getData();
(0, _chai.expect)(data.iframeMode).to.be.equal(true);
});
});
describe('watchData', function () {
it('should add the handler to handlers', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var fn = function fn() {};
syncedData.watchData(fn);
var fnStored = syncedData._handlers.pop();
(0, _chai.expect)(fnStored).to.be.equal(fn);
});
it('should remove the handler when the return function called', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var stop = syncedData.watchData(function () {});
var countStart = syncedData._handlers.length;
stop();
var countEnd = syncedData._handlers.length;
(0, _chai.expect)(countStart - countEnd).to.be.equal(1);
});
});
describe('setData', function () {
it('should emit data to the pageBus', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var kkr = _uuid2.default.v4();
var originalEmit = syncedData._bus.emit;
syncedData._bus.emit = _sinon2.default.stub();
syncedData.setData({ kkr: kkr });
var data = syncedData.getData();
var sentString = syncedData._bus.emit.args[0][1];
var sentJSON = JSON.parse(sentString);
(0, _chai.expect)(sentJSON).to.deep.equal(data);
syncedData._bus.emit = originalEmit;
});
it('should update existing data', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var kkr = _uuid2.default.v4();
var originalEmit = syncedData._bus.emit;
syncedData._bus.emit = _sinon2.default.stub();
var previousKKR = syncedData.getData().kkr;
syncedData.setData({ kkr: kkr });
var data = syncedData.getData();
(0, _chai.expect)(data.kkr).not.to.be.equal(previousKKR);
syncedData._bus.emit = originalEmit;
});
it('should run all handlers with the data', function (done) {
var syncedData = getSyncedData(_uuid2.default.v4());
var kkr = _uuid2.default.v4();
var stop = syncedData.watchData(function (data) {
stop();
(0, _chai.expect)(data.kkr).to.be.equal(kkr);
done();
});
var originalEmit = syncedData._bus.emit;
syncedData._bus.emit = _sinon2.default.stub();
syncedData.setData({ kkr: kkr });
syncedData._bus.emit = originalEmit;
});
it('should add a property with __lastUpdated with Date.now()', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var now = _uuid2.default.v4();
var originalEmit = syncedData._bus.emit;
syncedData._bus.emit = _sinon2.default.stub();
var originalNow = Date.now;
Date.now = function () {
return now;
};
syncedData.setData({ aa: 10 });
var data = syncedData.getData();
(0, _chai.expect)(data.__lastUpdated).to.be.equal(now);
Date.now = originalNow;
syncedData._bus.emit = originalEmit;
});
});
describe('receiveData', function () {
it('should set received data as the new data', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var previousData = syncedData.getData();
var newData = { kkr: _uuid2.default.v4() };
syncedData._onData((0, _stringify2.default)(newData));
var updatedData = syncedData.getData();
delete updatedData.iframeMode;
(0, _chai.expect)(updatedData).to.deep.equal(newData);
(0, _chai.expect)(previousData).not.to.deep.equal(newData);
});
it('should run all handlers with data', function (done) {
var syncedData = getSyncedData(_uuid2.default.v4());
var newData = { kkr: _uuid2.default.v4() };
var stop = syncedData.watchData(function (data) {
stop();
var updatedData = (0, _extends3.default)({}, data);
delete updatedData.iframeMode;
(0, _chai.expect)(updatedData).to.deep.equal(newData);
done();
});
syncedData._onData((0, _stringify2.default)(newData));
});
it('should set the local iframeMode to data', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var newData = {
kkr: _uuid2.default.v4(),
iframeMode: _uuid2.default.v4()
};
var oldIframeMode = syncedData.getData().iframeMode;
syncedData._onData((0, _stringify2.default)(newData));
var newIframeMode = syncedData.getData().iframeMode;
(0, _chai.expect)(newIframeMode).to.be.deep.equal(oldIframeMode);
});
});
describe('getDataKey', function () {
it('should get the data key prefixed with the current dataId', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var dataId = syncedData.getData().dataId;
var dataKey = syncedData.getDataKey();
(0, _chai.expect)(dataKey).to.be.equal('data-' + dataId);
});
});
});

56
dist/client/__tests__/index.js vendored Normal file
View File

@ -0,0 +1,56 @@
'use strict';
var _chai = require('chai');
var _global = global;
var describe = _global.describe;
var it = _global.it;
describe('client.index', function () {
describe('storiesOf', function () {
it('should add the story to storybox');
it('should return .add method');
it('should return .add method even called .add');
it('should remove story kind on hot module dispose');
});
describe('action', function () {
it('should push the action to existing actions');
it('should only keep recent 5 actions');
it('should replace Synthetic events with their name');
});
describe('renderError', function () {
it('should set error stack and message into data.setData');
});
describe('renderMain', function () {
it('should run loaders');
it('should call data.setData with the storybook dump');
it('should call data.setData with the __updatedAt');
it('should reset data.error');
describe('current selectedKind is not available', function () {
it('should select selectedKind from the first storykind');
});
describe('there is a selectedKind in storybook', function () {
describe('current selectedStory is not available', function () {
it('should select selectedStory from the first story');
});
});
});
describe('configure', function () {
describe('immediately', function () {
it('should run renderMain');
it('should run renderError if there was an error running renderMain');
});
describe('on hot reload', function () {
it('should run renderMain');
it('should run renderError if there was an error running renderMain');
});
});
});

179
dist/client/__tests__/story_store.js vendored Normal file
View File

@ -0,0 +1,179 @@
'use strict';
var _chai = require('chai');
var _uuid = require('uuid');
var _uuid2 = _interopRequireDefault(_uuid);
var _story_store = require('../story_store');
var _story_store2 = _interopRequireDefault(_story_store);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _global = global;
var describe = _global.describe;
var it = _global.it;
var beforeEach = _global.beforeEach;
var storyStore = new _story_store2.default();
describe('client.StoryStore', function () {
beforeEach(function () {
return storyStore.clean();
});
describe('addStory', function () {
it('should add the first story properly', function () {
var kind = _uuid2.default.v4();
function story() {}
storyStore.addStory(kind, 'name', story);
(0, _chai.expect)(storyStore.getStory(kind, 'name')).to.be.equal(story);
});
it('should add another story of the previous kind', function () {
var kind = _uuid2.default.v4();
function story1() {}
function story2() {}
storyStore.addStory(kind, 'name1', story1);
storyStore.addStory(kind, 'name2', story2);
(0, _chai.expect)(storyStore.getStory(kind, 'name1')).to.be.equal(story1);
(0, _chai.expect)(storyStore.getStory(kind, 'name2')).to.be.equal(story2);
});
it('should replace the same story if came again', function () {
var kind = _uuid2.default.v4();
function story1() {}
function story2() {}
storyStore.addStory(kind, 'name', story1);
storyStore.addStory(kind, 'name', story2);
(0, _chai.expect)(storyStore.getStory(kind, 'name')).to.be.equal(story2);
});
});
describe('getStoryKinds', function () {
it('should return all story kind names with FIFO order', function () {
var kind1 = _uuid2.default.v4();
var kind2 = _uuid2.default.v4();
var kind3 = _uuid2.default.v4();
function story() {}
storyStore.addStory(kind1, 'name', story);
storyStore.addStory(kind2, 'name', story);
storyStore.addStory(kind3, 'name', story);
(0, _chai.expect)(storyStore.getStoryKinds()).to.deep.equal([kind1, kind2, kind3]);
});
});
describe('getStories', function () {
it('should return an empty array, if there is no kind', function () {
var kind = _uuid2.default.v4();
(0, _chai.expect)(storyStore.getStories(kind)).to.deep.equal([]);
});
it('should return all story names with FIFO order', function () {
var kind = _uuid2.default.v4();
function story() {}
storyStore.addStory(kind, 'name1', story);
storyStore.addStory(kind, 'name2', story);
storyStore.addStory(kind, 'name3', story);
(0, _chai.expect)(storyStore.getStories(kind)).to.deep.equal(['name1', 'name2', 'name3']);
});
});
describe('getStory', function () {
it('should return null if there is no kind', function () {
var kind = _uuid2.default.v4();
(0, _chai.expect)(storyStore.getStory(kind, 'name')).to.be.equal(null);
});
it('should return null if there is no story', function () {
var kind = _uuid2.default.v4();
function story() {}
storyStore.addStory(kind, 'name', story);
(0, _chai.expect)(storyStore.getStory(kind, 'other-name')).to.be.equal(null);
});
it('shodld return the story if exists', function () {
var kind = _uuid2.default.v4();
function story() {}
storyStore.addStory(kind, 'name', story);
(0, _chai.expect)(storyStore.getStory(kind, 'name')).to.be.equal(story);
});
});
describe('removeStoryKind', function () {
it('should remove the given kind', function () {
var kind = _uuid2.default.v4();
function story() {}
storyStore.addStory(kind, 'name', story);
(0, _chai.expect)(storyStore.getStory(kind, 'name')).to.be.equal(story);
storyStore.removeStoryKind(kind);
(0, _chai.expect)(storyStore.getStory(kind, 'name')).to.be.equal(null);
});
});
describe('hasStoryKind', function () {
it('should return true if there is a kind', function () {
var kind = _uuid2.default.v4();
function story() {}
storyStore.addStory(kind, 'name', story);
(0, _chai.expect)(storyStore.hasStoryKind(kind)).to.be.equal(true);
});
it('should return false if there is no kind', function () {
var kind = _uuid2.default.v4();
(0, _chai.expect)(storyStore.hasStoryKind(kind)).to.be.equal(false);
});
});
describe('hasStory', function () {
it('should return true if there is a story', function () {
var kind = _uuid2.default.v4();
function story() {}
storyStore.addStory(kind, 'name', story);
(0, _chai.expect)(storyStore.hasStory(kind, 'name')).to.be.equal(true);
});
it('should return false if there is no kind', function () {
var kind = _uuid2.default.v4();
(0, _chai.expect)(storyStore.hasStoryKind(kind, 'name')).to.be.equal(false);
});
it('should return false if there is no story', function () {
var kind = _uuid2.default.v4();
function story() {}
storyStore.addStory(kind, 'name', story);
(0, _chai.expect)(storyStore.hasStory(kind, 'name2')).to.be.equal(false);
});
});
describe('dumpStoryBook', function () {
it('should dump all story kinds and stories properly', function () {
var kind1 = _uuid2.default.v4();
var kind2 = _uuid2.default.v4();
function story() {}
storyStore.addStory(kind1, 'name1', story);
storyStore.addStory(kind1, 'name2', story);
storyStore.addStory(kind2, 'name10', story);
storyStore.addStory(kind2, 'name20', story);
(0, _chai.expect)(storyStore.dumpStoryBook()).to.be.deep.equal([{ kind: kind1, stories: ['name1', 'name2'] }, { kind: kind2, stories: ['name10', 'name20'] }]);
});
});
});

179
dist/client/__tests__/storybook.js vendored Normal file
View File

@ -0,0 +1,179 @@
'use strict';
var _chai = require('chai');
var _uuid = require('uuid');
var _uuid2 = _interopRequireDefault(_uuid);
var _storybook = require('../storybook');
var _storybook2 = _interopRequireDefault(_storybook);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _global = global;
var describe = _global.describe;
var it = _global.it;
var beforeEach = _global.beforeEach;
var storybook = new _storybook2.default();
describe('client.storybook', function () {
beforeEach(function () {
return storybook.clean();
});
describe('storybook.addStory', function () {
it('should add the first story properly', function () {
var kind = _uuid2.default.v4();
function story() {}
storybook.addStory(kind, 'name', story);
(0, _chai.expect)(storybook.getStory(kind, 'name')).to.be.equal(story);
});
it('should add another story of the previous kind', function () {
var kind = _uuid2.default.v4();
function story1() {}
function story2() {}
storybook.addStory(kind, 'name1', story1);
storybook.addStory(kind, 'name2', story2);
(0, _chai.expect)(storybook.getStory(kind, 'name1')).to.be.equal(story1);
(0, _chai.expect)(storybook.getStory(kind, 'name2')).to.be.equal(story2);
});
it('should replace the same story if came again', function () {
var kind = _uuid2.default.v4();
function story1() {}
function story2() {}
storybook.addStory(kind, 'name', story1);
storybook.addStory(kind, 'name', story2);
(0, _chai.expect)(storybook.getStory(kind, 'name')).to.be.equal(story2);
});
});
describe('storybook.getStoryKinds', function () {
it('should return all story kind names with FIFO order', function () {
var kind1 = _uuid2.default.v4();
var kind2 = _uuid2.default.v4();
var kind3 = _uuid2.default.v4();
function story() {}
storybook.addStory(kind1, 'name', story);
storybook.addStory(kind2, 'name', story);
storybook.addStory(kind3, 'name', story);
(0, _chai.expect)(storybook.getStoryKinds()).to.deep.equal([kind1, kind2, kind3]);
});
});
describe('storybook.getStories', function () {
it('should return an empty array, if there is no kind', function () {
var kind = _uuid2.default.v4();
(0, _chai.expect)(storybook.getStories(kind)).to.deep.equal([]);
});
it('should return all story names with FIFO order', function () {
var kind = _uuid2.default.v4();
function story() {}
storybook.addStory(kind, 'name1', story);
storybook.addStory(kind, 'name2', story);
storybook.addStory(kind, 'name3', story);
(0, _chai.expect)(storybook.getStories(kind)).to.deep.equal(['name1', 'name2', 'name3']);
});
});
describe('storybook.getStory', function () {
it('should return null if there is no kind', function () {
var kind = _uuid2.default.v4();
(0, _chai.expect)(storybook.getStory(kind, 'name')).to.be.equal(null);
});
it('should return null if there is no story', function () {
var kind = _uuid2.default.v4();
function story() {}
storybook.addStory(kind, 'name', story);
(0, _chai.expect)(storybook.getStory(kind, 'other-name')).to.be.equal(null);
});
it('shodld return the story if exists', function () {
var kind = _uuid2.default.v4();
function story() {}
storybook.addStory(kind, 'name', story);
(0, _chai.expect)(storybook.getStory(kind, 'name')).to.be.equal(story);
});
});
describe('storybook.removeStoryKind', function () {
it('should remove the given kind', function () {
var kind = _uuid2.default.v4();
function story() {}
storybook.addStory(kind, 'name', story);
(0, _chai.expect)(storybook.getStory(kind, 'name')).to.be.equal(story);
storybook.removeStoryKind(kind);
(0, _chai.expect)(storybook.getStory(kind, 'name')).to.be.equal(null);
});
});
describe('storybook.hasStoryKind', function () {
it('should return true if there is a kind', function () {
var kind = _uuid2.default.v4();
function story() {}
storybook.addStory(kind, 'name', story);
(0, _chai.expect)(storybook.hasStoryKind(kind)).to.be.equal(true);
});
it('should return false if there is no kind', function () {
var kind = _uuid2.default.v4();
(0, _chai.expect)(storybook.hasStoryKind(kind)).to.be.equal(false);
});
});
describe('storybook.hasStory', function () {
it('should return true if there is a story', function () {
var kind = _uuid2.default.v4();
function story() {}
storybook.addStory(kind, 'name', story);
(0, _chai.expect)(storybook.hasStory(kind, 'name')).to.be.equal(true);
});
it('should return false if there is no kind', function () {
var kind = _uuid2.default.v4();
(0, _chai.expect)(storybook.hasStoryKind(kind, 'name')).to.be.equal(false);
});
it('should return false if there is no story', function () {
var kind = _uuid2.default.v4();
function story() {}
storybook.addStory(kind, 'name', story);
(0, _chai.expect)(storybook.hasStory(kind, 'name2')).to.be.equal(false);
});
});
describe('storybook.dumpStoryBook', function () {
it('should dump all story kinds and stories properly', function () {
var kind1 = _uuid2.default.v4();
var kind2 = _uuid2.default.v4();
function story() {}
storybook.addStory(kind1, 'name1', story);
storybook.addStory(kind1, 'name2', story);
storybook.addStory(kind2, 'name10', story);
storybook.addStory(kind2, 'name20', story);
(0, _chai.expect)(storybook.dumpStoryBook()).to.be.deep.equal([{ kind: kind1, stories: ['name1', 'name2'] }, { kind: kind2, stories: ['name10', 'name20'] }]);
});
});
});

228
dist/client/__tests__/synced_store.js vendored Normal file
View File

@ -0,0 +1,228 @@
'use strict';
var _extends2 = require('babel-runtime/helpers/extends');
var _extends3 = _interopRequireDefault(_extends2);
var _stringify = require('babel-runtime/core-js/json/stringify');
var _stringify2 = _interopRequireDefault(_stringify);
var _typeof2 = require('babel-runtime/helpers/typeof');
var _typeof3 = _interopRequireDefault(_typeof2);
var _uuid = require('uuid');
var _uuid2 = _interopRequireDefault(_uuid);
var _sinon = require('sinon');
var _sinon2 = _interopRequireDefault(_sinon);
var _chai = require('chai');
var _synced_store = require('../synced_store');
var _synced_store2 = _interopRequireDefault(_synced_store);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _global = global;
var describe = _global.describe;
var it = _global.it;
function getSyncedData(dataId) {
var window = {
location: {},
addEventListener: function addEventListener() {}
};
if (dataId) {
window.location.search = '?dataId=' + dataId;
}
var syncedData = new _synced_store2.default(window);
syncedData._bus = {};
return syncedData;
}
describe('client.SyncedStore', function () {
describe('normal mode', function () {
it('should set the `iframeMode` as false', function () {
var syncedData = getSyncedData();
var data = syncedData.getData();
(0, _chai.expect)(data.iframeMode).to.be.equal(false);
});
it('should set a random Id to dataId', function () {
var syncedData = getSyncedData();
var data = syncedData.getData();
(0, _chai.expect)((0, _typeof3.default)(data.dataId)).to.be.equal('string');
});
});
describe('iframe mode', function () {
it('should get the dataId from the URL', function () {
var currentDataId = _uuid2.default.v4();
var syncedData = getSyncedData(currentDataId);
var data = syncedData.getData();
(0, _chai.expect)(data.dataId).to.be.equal(currentDataId);
});
it('should set the iframeMode as true', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var data = syncedData.getData();
(0, _chai.expect)(data.iframeMode).to.be.equal(true);
});
});
describe('watchData', function () {
it('should add the handler to handlers', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var fn = function fn() {};
syncedData.watchData(fn);
var fnStored = syncedData._handlers.pop();
(0, _chai.expect)(fnStored).to.be.equal(fn);
});
it('should remove the handler when the return function called', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var stop = syncedData.watchData(function () {});
var countStart = syncedData._handlers.length;
stop();
var countEnd = syncedData._handlers.length;
(0, _chai.expect)(countStart - countEnd).to.be.equal(1);
});
});
describe('setData', function () {
it('should emit data to the pageBus', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var kkr = _uuid2.default.v4();
var originalEmit = syncedData._bus.emit;
syncedData._bus.emit = _sinon2.default.stub();
syncedData.setData({ kkr: kkr });
var data = syncedData.getData();
var sentString = syncedData._bus.emit.args[0][1];
var sentJSON = JSON.parse(sentString);
(0, _chai.expect)(sentJSON).to.deep.equal(data);
syncedData._bus.emit = originalEmit;
});
it('should update existing data', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var kkr = _uuid2.default.v4();
var originalEmit = syncedData._bus.emit;
syncedData._bus.emit = _sinon2.default.stub();
var previousKKR = syncedData.getData().kkr;
syncedData.setData({ kkr: kkr });
var data = syncedData.getData();
(0, _chai.expect)(data.kkr).not.to.be.equal(previousKKR);
syncedData._bus.emit = originalEmit;
});
it('should run all handlers with the data', function (done) {
var syncedData = getSyncedData(_uuid2.default.v4());
var kkr = _uuid2.default.v4();
var stop = syncedData.watchData(function (data) {
stop();
(0, _chai.expect)(data.kkr).to.be.equal(kkr);
done();
});
var originalEmit = syncedData._bus.emit;
syncedData._bus.emit = _sinon2.default.stub();
syncedData.setData({ kkr: kkr });
syncedData._bus.emit = originalEmit;
});
it('should add a property with __lastUpdated with Date.now()', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var now = _uuid2.default.v4();
var originalEmit = syncedData._bus.emit;
syncedData._bus.emit = _sinon2.default.stub();
var originalNow = Date.now;
Date.now = function () {
return now;
};
syncedData.setData({ aa: 10 });
var data = syncedData.getData();
(0, _chai.expect)(data.__lastUpdated).to.be.equal(now);
Date.now = originalNow;
syncedData._bus.emit = originalEmit;
});
});
describe('receiveData', function () {
it('should set received data as the new data', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var previousData = syncedData.getData();
var newData = { kkr: _uuid2.default.v4() };
syncedData._onData((0, _stringify2.default)(newData));
var updatedData = syncedData.getData();
delete updatedData.iframeMode;
(0, _chai.expect)(updatedData).to.deep.equal(newData);
(0, _chai.expect)(previousData).not.to.deep.equal(newData);
});
it('should run all handlers with data', function (done) {
var syncedData = getSyncedData(_uuid2.default.v4());
var newData = { kkr: _uuid2.default.v4() };
var stop = syncedData.watchData(function (data) {
stop();
var updatedData = (0, _extends3.default)({}, data);
delete updatedData.iframeMode;
(0, _chai.expect)(updatedData).to.deep.equal(newData);
done();
});
syncedData._onData((0, _stringify2.default)(newData));
});
it('should set the local iframeMode to data', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var newData = {
kkr: _uuid2.default.v4(),
iframeMode: _uuid2.default.v4()
};
var oldIframeMode = syncedData.getData().iframeMode;
syncedData._onData((0, _stringify2.default)(newData));
var newIframeMode = syncedData.getData().iframeMode;
(0, _chai.expect)(newIframeMode).to.be.deep.equal(oldIframeMode);
});
});
describe('getDataKey', function () {
it('should get the data key prefixed with the current dataId', function () {
var syncedData = getSyncedData(_uuid2.default.v4());
var dataId = syncedData.getData().dataId;
var dataKey = syncedData.getDataKey();
(0, _chai.expect)(dataKey).to.be.equal('data-' + dataId);
});
});
});

80
dist/client/client_api.js vendored Normal file
View File

@ -0,0 +1,80 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _from = require("babel-runtime/core-js/array/from");
var _from2 = _interopRequireDefault(_from);
var _classCallCheck2 = require("babel-runtime/helpers/classCallCheck");
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require("babel-runtime/helpers/createClass");
var _createClass3 = _interopRequireDefault(_createClass2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var ClientApi = function () {
function ClientApi(_ref) {
var syncedStore = _ref.syncedStore;
var storyStore = _ref.storyStore;
(0, _classCallCheck3.default)(this, ClientApi);
this._syncedStore = syncedStore;
this._storyStore = storyStore;
}
(0, _createClass3.default)(ClientApi, [{
key: "storiesOf",
value: function storiesOf(kind, m) {
var _this = this;
if (m && m.hot) {
m.hot.dispose(function () {
_this._storyStore.removeStoryKind(kind);
});
}
var add = function add(storyName, fn) {
_this._storyStore.addStory(kind, storyName, fn);
return { add: add };
};
return { add: add };
}
}, {
key: "action",
value: function action(name) {
var syncedStore = this._syncedStore;
return function () {
for (var _len = arguments.length, _args = Array(_len), _key = 0; _key < _len; _key++) {
_args[_key] = arguments[_key];
}
var args = (0, _from2.default)(_args);
var _syncedStore$getData = syncedStore.getData();
var _syncedStore$getData$ = _syncedStore$getData.actions;
var actions = _syncedStore$getData$ === undefined ? [] : _syncedStore$getData$;
// Remove events from the args. Otherwise, it creates a huge JSON string.
if (args[0] && args[0].constructor && /Synthetic/.test(args[0].constructor.name)) {
args[0] = "[" + args[0].constructor.name + "]";
}
actions = [{ name: name, args: args }].concat(actions.slice(0, 4));
syncedStore.setData({ actions: actions });
};
}
}]);
return ClientApi;
}();
exports.default = ClientApi;

85
dist/client/config_api.js vendored Normal file
View File

@ -0,0 +1,85 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _classCallCheck2 = require("babel-runtime/helpers/classCallCheck");
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require("babel-runtime/helpers/createClass");
var _createClass3 = _interopRequireDefault(_createClass2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var ConfigApi = function () {
function ConfigApi(_ref) {
var syncedStore = _ref.syncedStore;
var storyStore = _ref.storyStore;
(0, _classCallCheck3.default)(this, ConfigApi);
this._syncedStore = syncedStore;
this._storyStore = storyStore;
}
(0, _createClass3.default)(ConfigApi, [{
key: "_renderMain",
value: function _renderMain(loaders) {
if (loaders) loaders();
var data = this._syncedStore.getData();
data.error = null;
data.__updatedAt = Date.now();
data.storyStore = this._storyStore.dumpStoryBook();
if (!this._storyStore.hasStoryKind(data.selectedKind)) {
data.selectedKind = this._storyStore.getStoryKinds()[0];
}
if (this._storyStore.hasStoryKind(data.selectedKind)) {
if (!this._storyStore.hasStory(data.selectedKind, data.selectedStory)) {
data.selectedStory = this._storyStore.getStories(data.selectedKind, data.selectedStory)[0];
}
}
this._syncedStore.setData(data);
}
}, {
key: "_renderError",
value: function _renderError(e) {
var data = this._syncedStore.getData();
var stack = e.stack;
var message = e.message;
data.error = { stack: stack, message: message };
this._syncedStore.setData(data);
}
}, {
key: "configure",
value: function configure(loaders, module) {
var _this = this;
var render = function render() {
try {
_this._renderMain(loaders);
} catch (error) {
_this._renderError(error);
}
};
if (module.hot) {
module.hot.accept(function () {
setTimeout(render);
});
}
render();
}
}]);
return ConfigApi;
}();
exports.default = ConfigApi;

137
dist/client/data.js vendored Normal file
View File

@ -0,0 +1,137 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _keys = require('babel-runtime/core-js/object/keys');
var _keys2 = _interopRequireDefault(_keys);
var _extends2 = require('babel-runtime/helpers/extends');
var _extends3 = _interopRequireDefault(_extends2);
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require('babel-runtime/helpers/createClass');
var _createClass3 = _interopRequireDefault(_createClass2);
var _pageBus = require('page-bus');
var _pageBus2 = _interopRequireDefault(_pageBus);
var _jsonStringifySafe = require('json-stringify-safe');
var _jsonStringifySafe2 = _interopRequireDefault(_jsonStringifySafe);
var _queryString = require('query-string');
var _queryString2 = _interopRequireDefault(_queryString);
var _uuid = require('uuid');
var _uuid2 = _interopRequireDefault(_uuid);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var Data = function () {
function Data(window) {
(0, _classCallCheck3.default)(this, Data);
this._window = window;
this._parsedQs = _queryString2.default.parse(window.location.search);
// We need to check whether we are inside a iframe or not.
// This is used by here and as well as in the UI
this._iframeMode = Boolean(this._parsedQs.dataId);
// We need to create a unique Id for each page. We need to communicate
// using this id as a namespace. Otherwise, each every iframe will get the
// data.
// We create a new UUID if this is main page. Then, this is used by UI to
// create queryString param when creating the iframe.
// If we are in the iframe, we'll get it from the queryString.
this._dataId = this._iframeMode ? this._parsedQs.dataId : _uuid2.default.v4();
this._data = {
iframeMode: this._iframeMode,
dataId: this._dataId
};
this._handlers = [];
}
(0, _createClass3.default)(Data, [{
key: '_onData',
value: function _onData(dataString) {
var _this = this;
var d = JSON.parse(dataString);
this._data = (0, _extends3.default)({}, d, {
iframeMode: this._iframeMode
});
this._handlers.forEach(function (handler) {
handler(_this.getData());
});
}
}, {
key: 'init',
value: function init() {
var _this2 = this;
this._bus = (0, _pageBus2.default)();
// listen to the bus and apply
this._bus.on(this.getDataKey(), this._onData.bind(this));
// do initial render
this._handlers.forEach(function (handler) {
return handler(_this2.getData());
});
}
}, {
key: 'getDataKey',
value: function getDataKey() {
return 'data-' + this._data.dataId;
}
}, {
key: 'getData',
value: function getData() {
return (0, _extends3.default)({}, this._data);
}
}, {
key: 'setData',
value: function setData(fields) {
var _this3 = this;
(0, _keys2.default)(fields).forEach(function (key) {
_this3._data[key] = fields[key];
});
this._data.__lastUpdated = Date.now();
// In page-bus, we must send non-identical data.
// Otherwise, it'll cache and won't trigger.
// That's why we are setting the __lastUpdated value here.
this._bus.emit(this.getDataKey(), (0, _jsonStringifySafe2.default)(this.getData()));
this._handlers.forEach(function (handler) {
return handler(_this3.getData());
});
}
}, {
key: 'watchData',
value: function watchData(fn) {
var _this4 = this;
this._handlers.push(fn);
return function () {
var index = _this4._handlers.indexOf(fn);
_this4._handlers.splice(index, 1);
};
}
}]);
return Data;
}();
exports.default = Data;

44
dist/client/index.js vendored Normal file
View File

@ -0,0 +1,44 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.configure = exports.action = exports.storiesOf = undefined;
exports.getStoryStore = getStoryStore;
exports.getSyncedStore = getSyncedStore;
var _synced_store = require('./synced_store');
var _synced_store2 = _interopRequireDefault(_synced_store);
var _story_store = require('./story_store');
var _story_store2 = _interopRequireDefault(_story_store);
var _client_api = require('./client_api');
var _client_api2 = _interopRequireDefault(_client_api);
var _config_api = require('./config_api');
var _config_api2 = _interopRequireDefault(_config_api);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var storyStore = new _story_store2.default();
var syncedStore = new _synced_store2.default(window);
var clientApi = new _client_api2.default({ storyStore: storyStore, syncedStore: syncedStore });
var configApi = new _config_api2.default({ storyStore: storyStore, syncedStore: syncedStore });
syncedStore.init();
function getStoryStore() {
return storyStore;
}
function getSyncedStore() {
return syncedStore;
}
var storiesOf = exports.storiesOf = clientApi.storiesOf.bind(clientApi);
var action = exports.action = clientApi.action.bind(clientApi);
var configure = exports.configure = configApi.configure.bind(configApi);

16
dist/client/init_admin.js vendored Normal file
View File

@ -0,0 +1,16 @@
'use strict';
var _admin = require('./ui/admin');
var _admin2 = _interopRequireDefault(_admin);
var _ = require('./');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var syncedStore = (0, _.getSyncedStore)();
syncedStore.watchData(function (data) {
(0, _admin2.default)(data);
});
(0, _admin2.default)(syncedStore.getData());

11
dist/client/init_preview.js vendored Normal file
View File

@ -0,0 +1,11 @@
'use strict';
var _preview = require('./ui/preview');
var _preview2 = _interopRequireDefault(_preview);
var _ = require('./');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
(0, _.getSyncedStore)().watchData(_preview2.default);

131
dist/client/story_store.js vendored Normal file
View File

@ -0,0 +1,131 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _keys = require("babel-runtime/core-js/object/keys");
var _keys2 = _interopRequireDefault(_keys);
var _classCallCheck2 = require("babel-runtime/helpers/classCallCheck");
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require("babel-runtime/helpers/createClass");
var _createClass3 = _interopRequireDefault(_createClass2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var cnt = 0;
var StoreStore = function () {
function StoreStore() {
(0, _classCallCheck3.default)(this, StoreStore);
this._data = {};
}
(0, _createClass3.default)(StoreStore, [{
key: "addStory",
value: function addStory(kind, name, fn) {
if (!this._data[kind]) {
this._data[kind] = {
kind: kind,
index: cnt++,
stories: {}
};
}
this._data[kind].stories[name] = {
name: name,
index: cnt++,
fn: fn
};
}
}, {
key: "getStoryKinds",
value: function getStoryKinds() {
var _this = this;
return (0, _keys2.default)(this._data).map(function (key) {
return _this._data[key];
}).sort(function (info1, info2) {
return info1.index - info2.index;
}).map(function (info) {
return info.kind;
});
}
}, {
key: "getStories",
value: function getStories(kind) {
var _this2 = this;
if (!this._data[kind]) {
return [];
}
return (0, _keys2.default)(this._data[kind].stories).map(function (name) {
return _this2._data[kind].stories[name];
}).sort(function (info1, info2) {
return info1.index - info2.index;
}).map(function (info) {
return info.name;
});
}
}, {
key: "getStory",
value: function getStory(kind, name) {
var storiesKind = this._data[kind];
if (!storiesKind) {
return null;
}
var storyInfo = storiesKind.stories[name];
if (!storyInfo) {
return null;
}
return storyInfo.fn;
}
}, {
key: "removeStoryKind",
value: function removeStoryKind(kind) {
delete this._data[kind];
}
}, {
key: "hasStoryKind",
value: function hasStoryKind(kind) {
return Boolean(this._data[kind]);
}
}, {
key: "hasStory",
value: function hasStory(kind, name) {
return Boolean(this.getStory(kind, name));
}
}, {
key: "dumpStoryBook",
value: function dumpStoryBook() {
var _this3 = this;
var data = this.getStoryKinds().map(function (kind) {
return { kind: kind, stories: _this3.getStories(kind) };
});
return data;
}
}, {
key: "clean",
value: function clean() {
var _this4 = this;
this.getStoryKinds().forEach(function (kind) {
return delete _this4._data[kind];
});
}
}]);
return StoreStore;
}();
exports.default = StoreStore;

131
dist/client/storybook.js vendored Normal file
View File

@ -0,0 +1,131 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
var _keys = require("babel-runtime/core-js/object/keys");
var _keys2 = _interopRequireDefault(_keys);
var _classCallCheck2 = require("babel-runtime/helpers/classCallCheck");
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require("babel-runtime/helpers/createClass");
var _createClass3 = _interopRequireDefault(_createClass2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var cnt = 0;
var Storybook = function () {
function Storybook() {
(0, _classCallCheck3.default)(this, Storybook);
this._data = {};
}
(0, _createClass3.default)(Storybook, [{
key: "addStory",
value: function addStory(kind, name, fn) {
if (!this._data[kind]) {
this._data[kind] = {
kind: kind,
index: cnt++,
stories: {}
};
}
this._data[kind].stories[name] = {
name: name,
index: cnt++,
fn: fn
};
}
}, {
key: "getStoryKinds",
value: function getStoryKinds() {
var _this = this;
return (0, _keys2.default)(this._data).map(function (key) {
return _this._data[key];
}).sort(function (info1, info2) {
return info1.index - info2.index;
}).map(function (info) {
return info.kind;
});
}
}, {
key: "getStories",
value: function getStories(kind) {
var _this2 = this;
if (!this._data[kind]) {
return [];
}
return (0, _keys2.default)(this._data[kind].stories).map(function (name) {
return _this2._data[kind].stories[name];
}).sort(function (info1, info2) {
return info1.index - info2.index;
}).map(function (info) {
return info.name;
});
}
}, {
key: "getStory",
value: function getStory(kind, name) {
var storiesKind = this._data[kind];
if (!storiesKind) {
return null;
}
var storyInfo = storiesKind.stories[name];
if (!storyInfo) {
return null;
}
return storyInfo.fn;
}
}, {
key: "removeStoryKind",
value: function removeStoryKind(kind) {
delete this._data[kind];
}
}, {
key: "hasStoryKind",
value: function hasStoryKind(kind) {
return Boolean(this._data[kind]);
}
}, {
key: "hasStory",
value: function hasStory(kind, name) {
return Boolean(this.getStory(kind, name));
}
}, {
key: "dumpStoryBook",
value: function dumpStoryBook() {
var _this3 = this;
var data = this.getStoryKinds().map(function (kind) {
return { kind: kind, stories: _this3.getStories(kind) };
});
return data;
}
}, {
key: "clean",
value: function clean() {
var _this4 = this;
this.getStoryKinds().forEach(function (kind) {
return delete _this4._data[kind];
});
}
}]);
return Storybook;
}();
exports.default = Storybook;

137
dist/client/synced_store.js vendored Normal file
View File

@ -0,0 +1,137 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _keys = require('babel-runtime/core-js/object/keys');
var _keys2 = _interopRequireDefault(_keys);
var _extends2 = require('babel-runtime/helpers/extends');
var _extends3 = _interopRequireDefault(_extends2);
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require('babel-runtime/helpers/createClass');
var _createClass3 = _interopRequireDefault(_createClass2);
var _pageBus = require('page-bus');
var _pageBus2 = _interopRequireDefault(_pageBus);
var _jsonStringifySafe = require('json-stringify-safe');
var _jsonStringifySafe2 = _interopRequireDefault(_jsonStringifySafe);
var _queryString = require('query-string');
var _queryString2 = _interopRequireDefault(_queryString);
var _uuid = require('uuid');
var _uuid2 = _interopRequireDefault(_uuid);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var Data = function () {
function Data(window) {
(0, _classCallCheck3.default)(this, Data);
this._window = window;
this._parsedQs = _queryString2.default.parse(window.location.search);
// We need to check whether we are inside a iframe or not.
// This is used by here and as well as in the UI
this._iframeMode = Boolean(this._parsedQs.dataId);
// We need to create a unique Id for each page. We need to communicate
// using this id as a namespace. Otherwise, each every iframe will get the
// data.
// We create a new UUID if this is main page. Then, this is used by UI to
// create queryString param when creating the iframe.
// If we are in the iframe, we'll get it from the queryString.
this._dataId = this._iframeMode ? this._parsedQs.dataId : _uuid2.default.v4();
this._data = {
iframeMode: this._iframeMode,
dataId: this._dataId
};
this._handlers = [];
}
(0, _createClass3.default)(Data, [{
key: '_onData',
value: function _onData(dataString) {
var _this = this;
var d = JSON.parse(dataString);
this._data = (0, _extends3.default)({}, d, {
iframeMode: this._iframeMode
});
this._handlers.forEach(function (handler) {
handler(_this.getData());
});
}
}, {
key: 'init',
value: function init() {
var _this2 = this;
this._bus = (0, _pageBus2.default)();
// listen to the bus and apply
this._bus.on(this.getDataKey(), this._onData.bind(this));
// do initial render
this._handlers.forEach(function (handler) {
return handler(_this2.getData());
});
}
}, {
key: 'getDataKey',
value: function getDataKey() {
return 'data-' + this._data.dataId;
}
}, {
key: 'getData',
value: function getData() {
return (0, _extends3.default)({}, this._data);
}
}, {
key: 'setData',
value: function setData(fields) {
var _this3 = this;
(0, _keys2.default)(fields).forEach(function (key) {
_this3._data[key] = fields[key];
});
this._data.__lastUpdated = Date.now();
// In page-bus, we must send non-identical data.
// Otherwise, it'll cache and won't trigger.
// That's why we are setting the __lastUpdated value here.
this._bus.emit(this.getDataKey(), (0, _jsonStringifySafe2.default)(this.getData()));
this._handlers.forEach(function (handler) {
return handler(_this3.getData());
});
}
}, {
key: 'watchData',
value: function watchData(fn) {
var _this4 = this;
this._handlers.push(fn);
return function () {
var index = _this4._handlers.indexOf(fn);
_this4._handlers.splice(index, 1);
};
}
}]);
return Data;
}();
exports.default = Data;

64
dist/client/ui/action_logger.js vendored Normal file
View File

@ -0,0 +1,64 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var h3Style = {
fontFamily: '\n -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto",\n "Segoe UI", "Helvetica Neue", "Lucida Grande", sans-serif\n ',
color: '#444',
letterSpacing: '2px',
fontSize: 12,
margin: '12px 0 5px 0'
};
var preStyle = {
height: 105,
overflowY: 'auto',
backgroundColor: '#FFF',
borderRadius: 3,
padding: 8,
color: '#666',
border: '1px solid #EAEAEA'
};
var clearButtonStyle = {
marginLeft: 5
};
var ActionLogger = function ActionLogger(_ref) {
var actionLog = _ref.actionLog;
var onClear = _ref.onClear;
return _react2.default.createElement(
'div',
null,
_react2.default.createElement(
'h3',
{ style: h3Style },
'ACTION LOGGER',
_react2.default.createElement(
'button',
{ style: clearButtonStyle, onClick: onClear },
'CLEAR'
)
),
_react2.default.createElement(
'pre',
{ style: preStyle },
actionLog
)
);
};
ActionLogger.propTypes = {
actionLog: _react2.default.PropTypes.string.isRequired,
onClear: _react2.default.PropTypes.func
};
exports.default = ActionLogger;

127
dist/client/ui/admin.js vendored Normal file
View File

@ -0,0 +1,127 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends2 = require('babel-runtime/helpers/extends');
var _extends3 = _interopRequireDefault(_extends2);
exports.getControls = getControls;
exports.getIframe = getIframe;
exports.getActionLogger = getActionLogger;
exports.renderMain = renderMain;
exports.default = renderAdmin;
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _reactDom = require('react-dom');
var _reactDom2 = _interopRequireDefault(_reactDom);
var _jsonStringifySafe = require('json-stringify-safe');
var _jsonStringifySafe2 = _interopRequireDefault(_jsonStringifySafe);
var _controls = require('./controls');
var _controls2 = _interopRequireDefault(_controls);
var _action_logger = require('./action_logger');
var _action_logger2 = _interopRequireDefault(_action_logger);
var _layout = require('./layout');
var _layout2 = _interopRequireDefault(_layout);
var _ = require('../');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var rootEl = document.getElementById('root');
var syncedStore = (0, _.getSyncedStore)();
// Event handlers
function setSelectedKind(data, kind) {
var newData = (0, _extends3.default)({}, data);
var stories = newData.storyStore.find(function (item) {
return item.kind === kind;
}).stories;
newData.selectedKind = kind;
newData.selectedStory = stories[0];
syncedStore.setData(newData);
}
function setSelectedStory(data, block) {
var newData = (0, _extends3.default)({}, data);
newData.selectedStory = block;
syncedStore.setData(newData);
}
function clearLogs() {
var data = syncedStore.getData();
data.actions = [];
syncedStore.setData(data);
}
function getControls(data) {
return _react2.default.createElement(_controls2.default, {
storyStore: data.storyStore,
selectedKind: data.selectedKind,
selectedStory: data.selectedStory,
onKind: setSelectedKind.bind(null, data),
onStory: setSelectedStory.bind(null, data)
});
}
function getIframe(data) {
var iframeStyle = {
width: '100%',
height: '100%',
border: '0'
};
// We need to send dataId via queryString
// That's how our data layer can start communicate via the iframe.
var queryString = 'dataId=' + data.dataId;
return _react2.default.createElement('iframe', {
style: iframeStyle,
src: '/iframe?' + queryString
});
}
function getActionLogger(data) {
var _data$actions = data.actions;
var actions = _data$actions === undefined ? [] : _data$actions;
var log = actions.map(function (action) {
return (0, _jsonStringifySafe2.default)(action, null, 2);
}).join('\n\n');
return _react2.default.createElement(_action_logger2.default, { actionLog: log, onClear: clearLogs });
}
function renderMain(data) {
// Inside the main page, we simply render iframe.
var controls = getControls(data);
var iframe = getIframe(data);
var actionLogger = getActionLogger(data);
var root = _react2.default.createElement(_layout2.default, {
controls: controls,
preview: iframe,
actionLogger: actionLogger
});
_reactDom2.default.render(root, rootEl);
}
function renderAdmin(data) {
return renderMain(data);
}

203
dist/client/ui/controls.js vendored Normal file
View File

@ -0,0 +1,203 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require('babel-runtime/helpers/createClass');
var _createClass3 = _interopRequireDefault(_createClass2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var StorybookControls = function (_React$Component) {
(0, _inherits3.default)(StorybookControls, _React$Component);
function StorybookControls() {
(0, _classCallCheck3.default)(this, StorybookControls);
return (0, _possibleConstructorReturn3.default)(this, (0, _getPrototypeOf2.default)(StorybookControls).apply(this, arguments));
}
(0, _createClass3.default)(StorybookControls, [{
key: 'getKindNames',
value: function getKindNames() {
var storyStore = this.props.storyStore;
if (!storyStore) {
return [];
}
return storyStore.map(function (_ref) {
var kind = _ref.kind;
return kind;
});
}
}, {
key: 'getStories',
value: function getStories(kind) {
var storyStore = this.props.storyStore;
var storiesInfo = storyStore.find(function (item) {
return item.kind === kind;
});
if (!storiesInfo) {
return [];
}
return storiesInfo.stories;
}
}, {
key: 'fireOnKind',
value: function fireOnKind(kind) {
var onKind = this.props.onKind;
if (onKind) onKind(kind);
}
}, {
key: 'fireOnStory',
value: function fireOnStory(story) {
var onStory = this.props.onStory;
if (onStory) onStory(story);
}
}, {
key: 'renderStory',
value: function renderStory(story) {
var selectedStory = this.props.selectedStory;
var storyStyle = {
fontSize: 13,
padding: '8px 0px 8px 10px',
cursor: 'pointer'
};
if (story === selectedStory) {
storyStyle.fontWeight = 'bold';
}
return _react2.default.createElement(
'div',
{
key: story,
style: storyStyle,
onClick: this.fireOnStory.bind(this, story)
},
story
);
}
}, {
key: 'renderKind',
value: function renderKind(kind) {
var kindStyle = {
fontSize: 15,
padding: '10px 0px',
cursor: 'pointer',
borderBottom: '1px solid #EEE'
};
var selectedKind = this.props.selectedKind;
if (kind === selectedKind) {
var stories = this.getStories(selectedKind);
kindStyle.fontWeight = 'bold';
return _react2.default.createElement(
'div',
{ key: kind },
_react2.default.createElement(
'div',
{
style: kindStyle,
onClick: this.fireOnKind.bind(this, kind)
},
kind
),
_react2.default.createElement(
'div',
null,
stories.map(this.renderStory.bind(this))
)
);
}
return _react2.default.createElement(
'div',
{
key: kind,
style: kindStyle,
onClick: this.fireOnKind.bind(this, kind)
},
kind
);
}
}, {
key: 'render',
value: function render() {
var kindNames = this.getKindNames();
var mainStyle = {
fontFamily: '\n -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto",\n "Segoe UI", "Helvetica Neue", "Lucida Grande", sans-serif\n ',
padding: '20px 10px 10px 10px',
color: '#444'
};
var h1Style = {
textTransform: 'uppercase',
letterSpacing: '3.5px',
fontSize: '12px',
fontWeight: 'bolder',
color: '#828282',
border: '1px solid #C1C1C1',
textAlign: 'center',
borderRadius: '2px',
padding: '5px',
margin: '0 0 20px 0',
cursor: 'default'
};
return _react2.default.createElement(
'div',
{ style: mainStyle },
_react2.default.createElement(
'h3',
{ style: h1Style },
'React Storybook'
),
_react2.default.createElement(
'div',
null,
kindNames.map(this.renderKind.bind(this))
)
);
}
}]);
return StorybookControls;
}(_react2.default.Component);
exports.default = StorybookControls;
StorybookControls.propTypes = {
storyStore: _react2.default.PropTypes.array,
selectedKind: _react2.default.PropTypes.string,
selectedStory: _react2.default.PropTypes.string,
onKind: _react2.default.PropTypes.func,
onStory: _react2.default.PropTypes.func
};

128
dist/client/ui/layout.js vendored Normal file
View File

@ -0,0 +1,128 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require('babel-runtime/helpers/createClass');
var _createClass3 = _interopRequireDefault(_createClass2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var Layout = function (_React$Component) {
(0, _inherits3.default)(Layout, _React$Component);
function Layout() {
(0, _classCallCheck3.default)(this, Layout);
return (0, _possibleConstructorReturn3.default)(this, (0, _getPrototypeOf2.default)(Layout).apply(this, arguments));
}
(0, _createClass3.default)(Layout, [{
key: 'componentWillMount',
value: function componentWillMount() {
this.updateHeight();
}
}, {
key: 'componentDidMount',
value: function componentDidMount() {
window.addEventListener('resize', this.updateHeight.bind(this));
}
}, {
key: 'updateHeight',
value: function updateHeight() {
var _document = document;
var documentElement = _document.documentElement;
var body = _document.body;
var height = documentElement.clientHeight || body.clientHeight;
height -= 20;
this.setState({ height: height });
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var controls = _props.controls;
var preview = _props.preview;
var actionLogger = _props.actionLogger;
var height = this.state.height;
var rootStyles = {
height: height,
padding: 8,
backgroundColor: '#F7F7F7'
};
var controlsStyle = {
width: 240,
float: 'left',
height: '100%',
overflowY: 'auto'
};
var actionStyle = {
height: 150,
marginLeft: 250
};
var previewStyle = {
height: height - actionStyle.height - 25,
marginLeft: 250,
border: '1px solid #ECECEC',
borderRadius: 4,
padding: 5,
backgroundColor: '#FFF'
};
return _react2.default.createElement(
'div',
{ style: rootStyles },
_react2.default.createElement(
'div',
{ style: controlsStyle },
controls
),
_react2.default.createElement(
'div',
{ style: previewStyle },
preview
),
_react2.default.createElement(
'div',
{ style: actionStyle },
actionLogger
)
);
}
}]);
return Layout;
}(_react2.default.Component);
Layout.propTypes = {
controls: _react2.default.PropTypes.element.isRequired,
preview: _react2.default.PropTypes.element.isRequired,
actionLogger: _react2.default.PropTypes.element.isRequired
};
exports.default = Layout;

64
dist/client/ui/preview.js vendored Normal file
View File

@ -0,0 +1,64 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.renderError = renderError;
exports.renderMain = renderMain;
exports.default = renderPreview;
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _reactDom = require('react-dom');
var _reactDom2 = _interopRequireDefault(_reactDom);
var _redboxReact = require('redbox-react');
var _redboxReact2 = _interopRequireDefault(_redboxReact);
var _ = require('../');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var rootEl = document.getElementById('root');
function renderError(data, error) {
// We always need to render redbox in the mainPage if we get an error.
// Since this is an error, this affects to the main page as well.
var realError = new Error(error.message);
realError.stack = error.stack;
var redBox = _react2.default.createElement(_redboxReact2.default, { error: realError });
_reactDom2.default.render(redBox, rootEl);
}
function renderMain(data) {
var NoPreview = function NoPreview() {
return _react2.default.createElement(
'p',
null,
'No Preview Available!'
);
};
var noPreview = _react2.default.createElement(NoPreview, null);
var selectedKind = data.selectedKind;
var selectedStory = data.selectedStory;
var story = (0, _.getStoryStore)().getStory(selectedKind, selectedStory);
if (!story) {
return _reactDom2.default.render(noPreview, rootEl);
}
return _reactDom2.default.render(story(), rootEl);
}
function renderPreview(data) {
if (data.error) {
return renderError(data, data.error);
}
return renderMain(data);
}

9
dist/server/iframe.html.js vendored Normal file
View File

@ -0,0 +1,9 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = function () {
return "\n <!DOCTYPE html>\n <html>\n <head>\n <title>React Storybook</title>\n </head>\n <body>\n <div id=\"root\" />\n <script src=\"/static/preview.bundle.js\"></script>\n </body>\n </html>\n ";
};

15
dist/server/index.html.js vendored Normal file
View File

@ -0,0 +1,15 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = function () {
return '\n <!DOCTYPE html>\n <html>\n <head>\n <title>React Storybook</title>\n <script type="text/javascript">\n window.dataId = \'' + _uuid2.default.v4() + '\';\n </script>\n </head>\n <body style="margin: 0;">\n <div id="root" />\n <script src="/static/admin.bundle.js"></script>\n </body>\n </html>\n ';
};
var _uuid = require('uuid');
var _uuid2 = _interopRequireDefault(_uuid);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

137
dist/server/index.js vendored Executable file
View File

@ -0,0 +1,137 @@
#!/usr/bin/env node
'use strict';
var _webpack = require('webpack');
var _webpack2 = _interopRequireDefault(_webpack);
var _webpackDevMiddleware = require('webpack-dev-middleware');
var _webpackDevMiddleware2 = _interopRequireDefault(_webpackDevMiddleware);
var _webpackHotMiddleware = require('webpack-hot-middleware');
var _webpackHotMiddleware2 = _interopRequireDefault(_webpackHotMiddleware);
var _index = require('./index.html');
var _index2 = _interopRequireDefault(_index);
var _iframe = require('./iframe.html');
var _iframe2 = _interopRequireDefault(_iframe);
var _express = require('express');
var _express2 = _interopRequireDefault(_express);
var _commander = require('commander');
var _commander2 = _interopRequireDefault(_commander);
var _package = require('../../package.json');
var _package2 = _interopRequireDefault(_package);
var _webpack3 = require('./webpack.config');
var _webpack4 = _interopRequireDefault(_webpack3);
var _path = require('path');
var _path2 = _interopRequireDefault(_path);
var _fs = require('fs');
var _fs2 = _interopRequireDefault(_fs);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
process.env.NODE_ENV = 'production';
var logger = console;
_commander2.default.version(_package2.default.version).option('-p, --port [number]', 'Port to run Storybook (Required)', parseInt).option('-s, --static-dir [dir-name]', 'Directory where to load static files from').option('-c, --config-dir [dir-name]', 'Directory where to load Storybook configurations from').parse(process.argv);
if (!_commander2.default.port) {
logger.error('Error: port to run Storybook is required!\n');
_commander2.default.help();
process.exit(-1);
}
var app = (0, _express2.default)();
if (_commander2.default.staticDir) {
var staticPath = _path2.default.resolve(_commander2.default.staticDir);
if (_fs2.default.existsSync(staticPath)) {
logger.log('=> Loading static files from: ' + staticPath + ' .');
app.use(_express2.default.static(staticPath));
} else {
logger.error('Error: no such directory to load static files: ' + staticPath);
process.exit(-1);
}
}
// add config path to the entry
var configDir = _commander2.default.configDir || './.storybook';
var configDirPath = _path2.default.resolve(configDir);
// load babelrc file.
var babelrcPath = _path2.default.resolve('./.babelrc');
if (_fs2.default.existsSync(babelrcPath)) {
logger.info('=> Using custom .babelrc configurations.');
var babelrcContent = _fs2.default.readFileSync(babelrcPath);
try {
var babelrc = JSON.parse(babelrcContent);
_webpack4.default.module.loaders[0].query = babelrc;
} catch (ex) {
logger.error('=> Error parsing .babelrc file: ' + ex.message);
throw ex;
}
}
var storybookConfigPath = _path2.default.resolve(configDirPath, 'config.js');
if (!_fs2.default.existsSync(storybookConfigPath)) {
logger.error('=> Create a storybook config file in "' + configDir + '/config.js".\n');
process.exit(0);
}
_webpack4.default.entry.preview.push(storybookConfigPath);
// load custom webpack configurations
var customConfigPath = _path2.default.resolve(configDirPath, 'webpack.config.js');
if (_fs2.default.existsSync(customConfigPath)) {
var customConfig = require(customConfigPath);
if (customConfig.module.loaders) {
logger.info('=> Loading custom webpack loaders.');
_webpack4.default.module.loaders = _webpack4.default.module.loaders.concat(customConfig.module.loaders);
}
if (customConfig.plugins) {
logger.info(' => Loading custom webpack plugins.');
_webpack4.default.plugins = _webpack4.default.plugins.concat(customConfig.plugins);
}
}
var compiler = (0, _webpack2.default)(_webpack4.default);
var devMiddlewareOptions = {
noInfo: true,
publicPath: _webpack4.default.output.publicPath
};
app.use((0, _webpackDevMiddleware2.default)(compiler, devMiddlewareOptions));
app.use((0, _webpackHotMiddleware2.default)(compiler));
app.get('/', function (req, res) {
res.send((0, _index2.default)());
});
app.get('/iframe', function (req, res) {
res.send((0, _iframe2.default)());
});
app.listen(_commander2.default.port, function (error) {
if (error) {
throw error;
} else {
logger.info('\nReact Storybook started on => http://localhost:' + _commander2.default.port + '/ \n');
}
});

40
dist/server/webpack.config.js vendored Normal file
View File

@ -0,0 +1,40 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _path = require('path');
var _path2 = _interopRequireDefault(_path);
var _webpack = require('webpack');
var _webpack2 = _interopRequireDefault(_webpack);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var config = {
devtool: 'cheap-module-eval-source-map',
entry: {
admin: ['stack-source-map/register', _path2.default.resolve(__dirname, '../client/init_admin')],
preview: ['stack-source-map/register', 'webpack-hot-middleware/client', _path2.default.resolve(__dirname, '../client/init_preview')]
},
output: {
path: _path2.default.join(__dirname, 'dist'),
filename: '[name].bundle.js',
publicPath: '/static/'
},
plugins: [new _webpack2.default.optimize.OccurenceOrderPlugin(), new _webpack2.default.HotModuleReplacementPlugin()],
module: {
loaders: [{
test: /\.jsx?$/,
loader: 'babel',
query: { presets: ['react', 'es2015', 'stage-2'] },
exclude: [_path2.default.resolve('./node_modules'), _path2.default.resolve(__dirname, 'node_modules')],
include: [_path2.default.resolve('./'), __dirname]
}]
}
};
exports.default = config;