likelihood-widgets-react
Version:
A collection of React components used by Likelihood UI.
1,375 lines (1,274 loc) • 135 kB
JavaScript
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory(require("react"), require("lodash"), require("classnames"), require("react-dom"), require("react-redux"), require("redux"), require("react-transition-group"), require("redux-logger"), require("react-contenteditable"), require("react-inlinesvg"), require("react-tooltip"), require("redux-thunk"));
else if(typeof define === 'function' && define.amd)
define(["react", "lodash", "classnames", "react-dom", "react-redux", "redux", "react-transition-group", "redux-logger", "react-contenteditable", "react-inlinesvg", "react-tooltip", "redux-thunk"], factory);
else {
var a = typeof exports === 'object' ? factory(require("react"), require("lodash"), require("classnames"), require("react-dom"), require("react-redux"), require("redux"), require("react-transition-group"), require("redux-logger"), require("react-contenteditable"), require("react-inlinesvg"), require("react-tooltip"), require("redux-thunk")) : factory(root["react"], root["lodash"], root["classnames"], root["react-dom"], root["react-redux"], root["redux"], root["react-transition-group"], root["redux-logger"], root["react-contenteditable"], root["react-inlinesvg"], root["react-tooltip"], root["redux-thunk"]);
for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
}
})(this, function(__WEBPACK_EXTERNAL_MODULE_0__, __WEBPACK_EXTERNAL_MODULE_1__, __WEBPACK_EXTERNAL_MODULE_2__, __WEBPACK_EXTERNAL_MODULE_5__, __WEBPACK_EXTERNAL_MODULE_6__, __WEBPACK_EXTERNAL_MODULE_7__, __WEBPACK_EXTERNAL_MODULE_10__, __WEBPACK_EXTERNAL_MODULE_11__, __WEBPACK_EXTERNAL_MODULE_72__, __WEBPACK_EXTERNAL_MODULE_73__, __WEBPACK_EXTERNAL_MODULE_74__, __WEBPACK_EXTERNAL_MODULE_75__) {
return /******/ (function(modules) { // webpackBootstrap
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // identity function for calling harmony imports with the correct context
/******/ __webpack_require__.i = function(value) { return value; };
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, {
/******/ configurable: false,
/******/ enumerable: true,
/******/ get: getter
/******/ });
/******/ }
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "";
/******/
/******/ // Load entry module and return exports
/******/ return __webpack_require__(__webpack_require__.s = 12);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/***/ (function(module, exports) {
module.exports = require("react");
/***/ }),
/* 1 */
/***/ (function(module, exports) {
module.exports = require("lodash");
/***/ }),
/* 2 */
/***/ (function(module, exports) {
module.exports = require("classnames");
/***/ }),
/* 3 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
function __export(m) {
for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
}
Object.defineProperty(exports, "__esModule", { value: true });
__export(__webpack_require__(15));
__export(__webpack_require__(24));
__export(__webpack_require__(25));
__export(__webpack_require__(26));
__export(__webpack_require__(27));
__export(__webpack_require__(28));
__export(__webpack_require__(39));
__export(__webpack_require__(40));
__export(__webpack_require__(41));
var RefineDatasetSection_1 = __webpack_require__(38);
exports.RefineDatasetSection = RefineDatasetSection_1.RefineDatasetSectionWrapper;
var ExploreDatasetSection_1 = __webpack_require__(23);
exports.ExploreDatasetSection = ExploreDatasetSection_1.ExploreDatasetSectionWrapper;
/***/ }),
/* 4 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.emptyData = {
count: 0,
items: [],
};
exports.initialState = {
data: exports.emptyData,
imageField: null,
keyField: null,
loading: false,
activeItemIndex: null,
showDetail: false,
};
/***/ }),
/* 5 */
/***/ (function(module, exports) {
module.exports = require("react-dom");
/***/ }),
/* 6 */
/***/ (function(module, exports) {
module.exports = require("react-redux");
/***/ }),
/* 7 */
/***/ (function(module, exports) {
module.exports = require("redux");
/***/ }),
/* 8 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.specialOperators = ['is', 'is not'];
/***/ }),
/* 9 */
/***/ (function(module, exports) {
// shim for using process in browser
var process = module.exports = {};
// cached from whatever global is present so that test runners that stub it
// don't break things. But we need to wrap it in a try catch in case it is
// wrapped in strict mode code which doesn't define any globals. It's inside a
// function because try/catches deoptimize in certain engines.
var cachedSetTimeout;
var cachedClearTimeout;
function defaultSetTimout() {
throw new Error('setTimeout has not been defined');
}
function defaultClearTimeout () {
throw new Error('clearTimeout has not been defined');
}
(function () {
try {
if (typeof setTimeout === 'function') {
cachedSetTimeout = setTimeout;
} else {
cachedSetTimeout = defaultSetTimout;
}
} catch (e) {
cachedSetTimeout = defaultSetTimout;
}
try {
if (typeof clearTimeout === 'function') {
cachedClearTimeout = clearTimeout;
} else {
cachedClearTimeout = defaultClearTimeout;
}
} catch (e) {
cachedClearTimeout = defaultClearTimeout;
}
} ())
function runTimeout(fun) {
if (cachedSetTimeout === setTimeout) {
//normal enviroments in sane situations
return setTimeout(fun, 0);
}
// if setTimeout wasn't available but was latter defined
if ((cachedSetTimeout === defaultSetTimout || !cachedSetTimeout) && setTimeout) {
cachedSetTimeout = setTimeout;
return setTimeout(fun, 0);
}
try {
// when when somebody has screwed with setTimeout but no I.E. maddness
return cachedSetTimeout(fun, 0);
} catch(e){
try {
// When we are in I.E. but the script has been evaled so I.E. doesn't trust the global object when called normally
return cachedSetTimeout.call(null, fun, 0);
} catch(e){
// same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error
return cachedSetTimeout.call(this, fun, 0);
}
}
}
function runClearTimeout(marker) {
if (cachedClearTimeout === clearTimeout) {
//normal enviroments in sane situations
return clearTimeout(marker);
}
// if clearTimeout wasn't available but was latter defined
if ((cachedClearTimeout === defaultClearTimeout || !cachedClearTimeout) && clearTimeout) {
cachedClearTimeout = clearTimeout;
return clearTimeout(marker);
}
try {
// when when somebody has screwed with setTimeout but no I.E. maddness
return cachedClearTimeout(marker);
} catch (e){
try {
// When we are in I.E. but the script has been evaled so I.E. doesn't trust the global object when called normally
return cachedClearTimeout.call(null, marker);
} catch (e){
// same as above but when it's a version of I.E. that must have the global object for 'this', hopfully our context correct otherwise it will throw a global error.
// Some versions of I.E. have different rules for clearTimeout vs setTimeout
return cachedClearTimeout.call(this, marker);
}
}
}
var queue = [];
var draining = false;
var currentQueue;
var queueIndex = -1;
function cleanUpNextTick() {
if (!draining || !currentQueue) {
return;
}
draining = false;
if (currentQueue.length) {
queue = currentQueue.concat(queue);
} else {
queueIndex = -1;
}
if (queue.length) {
drainQueue();
}
}
function drainQueue() {
if (draining) {
return;
}
var timeout = runTimeout(cleanUpNextTick);
draining = true;
var len = queue.length;
while(len) {
currentQueue = queue;
queue = [];
while (++queueIndex < len) {
if (currentQueue) {
currentQueue[queueIndex].run();
}
}
queueIndex = -1;
len = queue.length;
}
currentQueue = null;
draining = false;
runClearTimeout(timeout);
}
process.nextTick = function (fun) {
var args = new Array(arguments.length - 1);
if (arguments.length > 1) {
for (var i = 1; i < arguments.length; i++) {
args[i - 1] = arguments[i];
}
}
queue.push(new Item(fun, args));
if (queue.length === 1 && !draining) {
runTimeout(drainQueue);
}
};
// v8 likes predictible objects
function Item(fun, array) {
this.fun = fun;
this.array = array;
}
Item.prototype.run = function () {
this.fun.apply(null, this.array);
};
process.title = 'browser';
process.browser = true;
process.env = {};
process.argv = [];
process.version = ''; // empty string to avoid regexp issues
process.versions = {};
function noop() {}
process.on = noop;
process.addListener = noop;
process.once = noop;
process.off = noop;
process.removeListener = noop;
process.removeAllListeners = noop;
process.emit = noop;
process.prependListener = noop;
process.prependOnceListener = noop;
process.listeners = function (name) { return [] }
process.binding = function (name) {
throw new Error('process.binding is not supported');
};
process.cwd = function () { return '/' };
process.chdir = function (dir) {
throw new Error('process.chdir is not supported');
};
process.umask = function() { return 0; };
/***/ }),
/* 10 */
/***/ (function(module, exports) {
module.exports = require("react-transition-group");
/***/ }),
/* 11 */
/***/ (function(module, exports) {
module.exports = require("redux-logger");
/***/ }),
/* 12 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
function __export(m) {
for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
}
Object.defineProperty(exports, "__esModule", { value: true });
__export(__webpack_require__(3));
/***/ }),
/* 13 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var exploreDataset_1 = __webpack_require__(4);
var initState = function (state) {
return {
type: 'INIT_STATE',
dataset: state,
};
};
var setData = function (data) {
return {
type: 'SET_DATA',
payload: {
data: data,
},
};
};
var setImageField = function (imageField) {
return {
type: 'SET_IMAGE_FIELD',
payload: {
imageField: imageField,
},
};
};
var setKeyField = function (keyField) {
return {
type: 'SET_KEY_FIELD',
payload: {
keyField: keyField,
},
};
};
var setLoading = function (loading) {
return {
type: 'SET_LOADING',
payload: {
loading: loading,
},
};
};
var setActiveItemIndex = function (activeItemIndex) {
return {
type: 'SET_ACTIVE_ITEM_INDEX',
payload: {
activeItemIndex: activeItemIndex,
},
};
};
var setShowDetail = function (showDetail) {
return {
type: 'SET_SHOW_DETAIL',
payload: {
showDetail: showDetail,
},
};
};
var startLoading = function () {
return function (dispatch) {
dispatch(initState(exploreDataset_1.initialState));
dispatch(setLoading(true));
};
};
var finishLoading = function () {
return function (dispatch) {
dispatch(setLoading(false));
};
};
var onItemClick = function (itemIndex) {
return function (dispatch) {
dispatch(setActiveItemIndex(itemIndex));
dispatch(setShowDetail(true));
};
};
exports.actions = {
initState: initState,
setData: setData,
setImageField: setImageField,
setKeyField: setKeyField,
setShowDetail: setShowDetail,
setActiveItemIndex: setActiveItemIndex,
startLoading: startLoading,
finishLoading: finishLoading,
onItemClick: onItemClick,
};
/***/ }),
/* 14 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var initFilterState = function (filters) {
return {
type: 'INIT_STATE',
filters: filters,
};
};
var addFilter = function () {
return {
type: 'ADD_FILTER',
};
};
var deleteFilter = function (id) {
return {
type: 'DELETE_FILTER',
payload: {
id: id,
},
};
};
var addEntry = function (id) {
return {
type: 'ADD_ENTRY',
payload: {
id: id,
},
};
};
var deleteEntry = function (id, entryIndex) {
return {
type: 'DELETE_ENTRY',
payload: {
id: id,
entry: {
index: entryIndex,
},
},
};
};
var changeFilterType = function (id, type) {
return {
type: 'CHANGE_FILTER_TYPE',
payload: {
id: id,
type: type,
},
};
};
var setHasFocus = function (id, hasFocus) {
return {
type: 'SET_HAS_FOCUS',
payload: {
id: id,
hasFocus: hasFocus,
},
};
};
var changeConjunction = function (id, conjunction) {
return {
type: 'CHANGE_CONJUNCTION',
payload: {
id: id,
conjunction: conjunction,
},
};
};
var changeOperator = function (id, entryIndex, operator) {
return {
type: 'CHANGE_ENTRY_OPERATOR',
payload: {
id: id,
entry: {
index: entryIndex,
operator: operator,
},
},
};
};
var changeEntryValue = function (id, entryIndex, value) {
return {
type: 'CHANGE_ENTRY_VALUE',
payload: {
id: id,
entry: {
index: entryIndex,
value: value,
},
},
};
};
exports.actions = {
initFilterState: initFilterState,
addFilter: addFilter,
deleteFilter: deleteFilter,
changeFilterType: changeFilterType,
setHasFocus: setHasFocus,
changeConjunction: changeConjunction,
addEntry: addEntry,
changeOperator: changeOperator,
changeEntryValue: changeEntryValue,
deleteEntry: deleteEntry,
};
/***/ }),
/* 15 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = __webpack_require__(0);
var react_dom_1 = __webpack_require__(5);
var cx = __webpack_require__(2);
var _ = __webpack_require__(1);
var lib_1 = __webpack_require__(3);
var searchSvg = __webpack_require__(67);
var styles = {};
if (typeof window !== 'undefined') {
styles = __webpack_require__(45);
}
var Dropdown = (function (_super) {
__extends(Dropdown, _super);
function Dropdown(props) {
var _this = _super.call(this, props) || this;
_this.onDropdownMount = function (dropdown) {
_this.dropdown = dropdown;
};
_this.handleOptionClick = function (item, index, evt) {
var _a = _this.props, onChange = _a.onChange, allowDeselect = _a.allowDeselect;
var selectedIndex = _this.getSelectedIndex();
var deselect = allowDeselect && index === selectedIndex;
if (!_this.controlled) {
_this.setState({
selectedIndex: deselect ? null : index,
});
}
onChange(deselect ? null : index);
};
_this.handleFocus = function (event) {
event.stopPropagation();
};
_this.handleBlur = function (event) {
var onBlur = _this.props.onBlur;
onBlur();
};
_this.onSearchboxMount = function (instance) {
_this.searchbox = react_dom_1.findDOMNode(instance);
};
_this.handleSearchValueChange = function (event) {
var value = event.target.value;
_this.setState({
searchValue: value,
});
};
_this.handleSearchIconClick = function () {
_this.searchbox.focus();
};
_this.handleSearchBoxFocus = function () {
_this.setState({
searchBoxFocused: true,
});
};
_this.handleSearchBoxBlur = function () {
_this.setState({
searchBoxFocused: false,
});
};
_this.controlled = props.selectedIndex !== null;
_this.state = {
selectedIndex: _this.controlled ? props.selectedIndex : null,
searchValue: '',
searchBoxFocused: false,
};
return _this;
}
Dropdown.prototype.componentDidMount = function () {
if (this.searchbox) {
this.searchbox.focus();
}
else if (this.dropdown) {
this.dropdown.focus();
}
};
Dropdown.prototype.render = function () {
var _a = this.props, showSearchbox = _a.showSearchbox, classNames = _a.classNames;
var searchBoxFocused = this.state.searchBoxFocused;
var optionBoxStyle = {
maxHeight: showSearchbox ? undefined : '280px',
};
return (React.createElement("div", { onBlur: this.handleBlur, tabIndex: 0, className: cx(classNames.concat(styles['Dropdown'])), ref: this.onDropdownMount, onFocus: this.handleFocus },
showSearchbox &&
React.createElement("div", { className: styles['search'] },
React.createElement(lib_1.Icon, { classNames: [styles['icon']], src: searchSvg, height: 20, width: 20, border: false, onClick: this.handleSearchIconClick, active: searchBoxFocused }),
React.createElement("input", { ref: this.onSearchboxMount, placeholder: "Search", className: styles['input'], onChange: this.handleSearchValueChange, onFocus: this.handleSearchBoxFocus, onBlur: this.handleSearchBoxBlur, spellCheck: false })),
React.createElement("div", { className: styles['optionBox'], style: optionBoxStyle }, this.getFilteredItems())));
};
Dropdown.prototype.getFilteredItems = function () {
var _this = this;
var items = this.props.items;
var searchValue = this.state.searchValue;
var selectedIndex = this.getSelectedIndex();
var filteredItems = _(items).filter(function (item) {
if (!_.isEmpty(searchValue) &&
!item.toLowerCase().includes(searchValue.toLowerCase())) {
return false;
}
return true;
}).map(function (item, index) {
return (React.createElement("div", { className: cx(styles['option'], (_a = {},
_a[styles['active']] = index === selectedIndex,
_a)), key: item, onMouseDown: _this.handleOptionClick.bind(_this, item, index) }, item));
var _a;
}).value();
if (filteredItems.length === 0) {
return (React.createElement("div", { className: styles['empty'] }, "No results."));
}
return filteredItems;
};
Dropdown.prototype.getSelectedIndex = function () {
return this.controlled ? this.props.selectedIndex : this.state.selectedIndex;
};
return Dropdown;
}(React.Component));
Dropdown.defaultProps = {
items: [],
selectedIndex: null,
showSearchbox: false,
allowDeselect: false,
classNames: [],
onChange: function () { return undefined; },
onBlur: function () { return undefined; },
};
exports.Dropdown = Dropdown;
/***/ }),
/* 16 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = __webpack_require__(0);
var cx = __webpack_require__(2);
var lodash_1 = __webpack_require__(1);
var lib_1 = __webpack_require__(3);
var StripedGrid_1 = __webpack_require__(20);
var utils_1 = __webpack_require__(21);
var closeSvg = __webpack_require__(68);
var styles = {};
if (typeof window !== 'undefined') {
styles = __webpack_require__(46);
}
var DetailPanel = (function (_super) {
__extends(DetailPanel, _super);
function DetailPanel(props) {
var _this = _super.call(this, props) || this;
_this.handleClose = function () {
var setShowDetail = _this.props.setShowDetail;
setShowDetail(false);
};
return _this;
}
DetailPanel.prototype.render = function () {
var _a = this.props, classNames = _a.classNames, item = _a.item, showDetail = _a.showDetail, imageField = _a.imageField;
return (React.createElement("div", { className: styles['DetailPanelWrapper'] },
React.createElement("div", { className: cx(classNames.concat(styles['DetailPanel'])), style: {
transform: showDetail ? 'translate3d(0, 0, 0)' : undefined,
} },
React.createElement("div", { className: styles['image'], style: {
backgroundImage: !lodash_1.isEmpty(imageField) && !lodash_1.isEmpty(item[imageField])
? utils_1.cssUrl(item[imageField])
: undefined,
} }),
React.createElement(StripedGrid_1.default, { classNames: [styles['stripedGrid']], item: item }),
React.createElement(lib_1.Icon, { classNames: [styles['close']], src: closeSvg, height: 24, width: 24, onMouseDown: this.handleClose, border: false }))));
};
return DetailPanel;
}(React.Component));
DetailPanel.defaultProps = {
item: {},
imageField: null,
showDetail: false,
setShowDetail: function (showDetail) { return undefined; },
classNames: [],
};
exports.default = DetailPanel;
/***/ }),
/* 17 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = __webpack_require__(0);
var cx = __webpack_require__(2);
var lodash_1 = __webpack_require__(1);
var styles = {};
if (typeof window !== 'undefined') {
styles = __webpack_require__(47);
}
var ImageItem = (function (_super) {
__extends(ImageItem, _super);
function ImageItem(props) {
var _this = _super.call(this, props) || this;
_this.onImageLoad = function () {
_this.setState({
imageLoaded: true,
});
};
_this.onImageLoadFail = function (err) {
_this.setState({
hasImage: false,
});
};
_this.state = {
hasImage: null,
imageLoaded: false,
};
return _this;
}
ImageItem.prototype.componentDidMount = function () {
this.checkIfHasImage(this.props);
};
ImageItem.prototype.componentWillReceiveProps = function (nextProps) {
this.checkIfHasImage(nextProps);
};
ImageItem.prototype.render = function () {
var _a = this.props, classNames = _a.classNames, item = _a.item, imageField = _a.imageField, active = _a.active, onClick = _a.onClick;
var _b = this.state, hasImage = _b.hasImage, imageLoaded = _b.imageLoaded;
return (React.createElement("div", { className: cx(classNames.concat(styles['ImageItem']), (_c = {},
_c[styles['active']] = active,
_c)), onClick: onClick }, hasImage === true &&
React.createElement("img", { src: item[imageField], className: cx(styles['image'], (_d = {},
_d[styles['imageLoaded']] = imageLoaded,
_d)), onLoad: this.onImageLoad, onError: this.onImageLoadFail, onAbort: this.onImageLoadFail })));
var _c, _d;
};
ImageItem.prototype.checkIfHasImage = function (props) {
var item = props.item, imageField = props.imageField;
this.setState({
hasImage: !lodash_1.isEmpty(item) && !lodash_1.isEmpty(item[imageField]),
});
};
return ImageItem;
}(React.Component));
ImageItem.defaultProps = {
item: {},
imageField: null,
active: false,
onClick: function () { return undefined; },
classNames: [],
};
exports.default = ImageItem;
/***/ }),
/* 18 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = __webpack_require__(0);
var cx = __webpack_require__(2);
var lodash_1 = __webpack_require__(1);
var exploreDataset_1 = __webpack_require__(4);
var ImageItem_1 = __webpack_require__(17);
var styles = {};
if (typeof window !== 'undefined') {
styles = __webpack_require__(48);
}
var ImageItemGrid = (function (_super) {
__extends(ImageItemGrid, _super);
function ImageItemGrid(props) {
var _this = _super.call(this, props) || this;
_this.handleImageItemClick = function (index) {
var onItemClick = _this.props.onItemClick;
onItemClick(index);
};
return _this;
}
ImageItemGrid.prototype.render = function () {
var _this = this;
var _a = this.props, classNames = _a.classNames, data = _a.data, imageField = _a.imageField, keyField = _a.keyField, activeItemIndex = _a.activeItemIndex;
return (React.createElement("div", { className: cx(classNames.concat(styles['ImageItemGrid'])) }, lodash_1.map(data.items, function (item, index) {
var key = keyField && item[keyField] ? item[keyField] : lodash_1.uniqueId('image-item');
return (React.createElement(ImageItem_1.default, { key: key, classNames: [styles['ImageItem']], imageField: imageField, item: item, onClick: _this.handleImageItemClick.bind(_this, index), active: activeItemIndex === index }));
})));
};
return ImageItemGrid;
}(React.Component));
ImageItemGrid.defaultProps = {
data: exploreDataset_1.emptyData,
imageField: null,
keyField: null,
activeItemIndex: null,
onItemClick: function (activeItemIndex) { return undefined; },
classNames: [],
};
exports.default = ImageItemGrid;
/***/ }),
/* 19 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = __webpack_require__(0);
var cx = __webpack_require__(2);
var _ = __webpack_require__(1);
var exploreDataset_1 = __webpack_require__(4);
var styles = {};
if (typeof window !== 'undefined') {
styles = __webpack_require__(49);
}
var ListItemGrid = (function (_super) {
__extends(ListItemGrid, _super);
function ListItemGrid(props) {
var _this = _super.call(this, props) || this;
_this.handleListItemClick = function (index) {
var onItemClick = _this.props.onItemClick;
onItemClick(index);
};
return _this;
}
ListItemGrid.prototype.render = function () {
var _this = this;
var _a = this.props, classNames = _a.classNames, data = _a.data, keyField = _a.keyField, activeItemIndex = _a.activeItemIndex;
return (React.createElement("div", { className: cx(classNames.concat(styles['ListItemGrid'])) }, _.map(data.items, function (item, index) {
var key = keyField && item[keyField] ? item[keyField] : _.uniqueId('list-item');
return (React.createElement("div", { key: key, className: cx(styles['ListItem'], (_a = {},
_a[styles['active']] = activeItemIndex === index,
_a)), onClick: _this.handleListItemClick.bind(_this, index) }, _this.constructLabel(index + 1, item)));
var _a;
})));
};
ListItemGrid.prototype.constructLabel = function (index, item) {
var keyField = this.props.keyField;
var valueString = _(item)
.omitBy(function (value, key) { return key === keyField; })
.values()
.filter(function (s) { return !s.toString().startsWith('http'); })
.filter(function (s) { return s.length < 50; })
.join(', ');
if (_.isEmpty(valueString)) {
return null;
}
return ('00' + index).slice(-3) + ", " + valueString;
};
return ListItemGrid;
}(React.Component));
ListItemGrid.defaultProps = {
data: exploreDataset_1.emptyData,
keyField: null,
activeItemIndex: null,
onItemClick: function (activeItemIndex) { return undefined; },
classNames: [],
};
exports.default = ListItemGrid;
/***/ }),
/* 20 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = __webpack_require__(0);
var react_dom_1 = __webpack_require__(5);
var cx = __webpack_require__(2);
var _ = __webpack_require__(1);
var styles = {};
if (typeof window !== 'undefined') {
styles = __webpack_require__(50);
}
var StripedGrid = (function (_super) {
__extends(StripedGrid, _super);
function StripedGrid(props) {
var _this = _super.call(this, props) || this;
_this.onGridMount = function (instance) {
_this.gridComponent = react_dom_1.findDOMNode(instance);
};
return _this;
}
StripedGrid.prototype.componentWillReceiveProps = function (nextProps) {
if (this.gridComponent) {
this.gridComponent.scrollTop = 0;
}
};
StripedGrid.prototype.render = function () {
var _this = this;
var _a = this.props, classNames = _a.classNames, item = _a.item;
var sortedItem = _(item).toPairs().sortBy(0).fromPairs().value();
return (React.createElement("div", { ref: this.onGridMount, className: cx(classNames.concat(styles['StripedGrid'])) },
React.createElement("div", { className: styles['key'] }, _.map(_.keys(sortedItem), function (key, index) { return (React.createElement("div", { key: key + index, className: styles['cell'], onClick: _this.handleCellClick }, key)); })),
React.createElement("div", { className: styles['value'] }, _.map(_.values(sortedItem), function (value, index) { return (React.createElement("div", { key: value + index, className: styles['cell'], onClick: _this.handleCellClick }, value)); }))));
};
StripedGrid.prototype.handleCellClick = function (event) {
var divElement = event.target;
if (window.getSelection && document.createRange) {
var selection = window.getSelection();
var selectedText = selection.toString();
if (_.isEmpty(selectedText)) {
var range = document.createRange();
range.selectNodeContents(divElement);
selection.removeAllRanges();
selection.addRange(range);
}
}
};
return StripedGrid;
}(React.Component));
StripedGrid.defaultProps = {
item: {},
classNames: [],
};
exports.default = StripedGrid;
/***/ }),
/* 21 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
function cssUrl(url) {
url = url
.replace(/ /g, '%20')
.replace(/^\s+|\s+$/g, '');
return "url(\"" + url + "\")";
}
exports.cssUrl = cssUrl;
/***/ }),
/* 22 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = __webpack_require__(0);
var react_redux_1 = __webpack_require__(6);
var cx = __webpack_require__(2);
var lodash_1 = __webpack_require__(1);
var exploreDatasetActions_1 = __webpack_require__(13);
var exploreDataset_1 = __webpack_require__(4);
var ImageItemGrid_1 = __webpack_require__(18);
var ListItemGrid_1 = __webpack_require__(19);
var DetailPanel_1 = __webpack_require__(16);
var styles = {};
if (typeof window !== 'undefined') {
styles = __webpack_require__(51);
}
var ExploreDatasetSection = (function (_super) {
__extends(ExploreDatasetSection, _super);
function ExploreDatasetSection(props) {
var _this = _super.call(this, props) || this;
_this.handleKeyDown = function (event) {
var _a = _this.props, setActiveItemIndex = _a.setActiveItemIndex, dataset = _a.dataset;
var keyCode = event.keyCode;
var activeItemIndex = dataset.activeItemIndex;
if (activeItemIndex === null || dataset.data === null) {
return;
}
var step = 1;
if (!lodash_1.isEmpty(dataset.imageField)) {
step = 4;
}
var itemCount = dataset.data.items.length;
if ([37, 38, 39, 40].indexOf(keyCode) !== -1) {
event.preventDefault();
}
switch (keyCode) {
case 37: {
if (activeItemIndex - 1 >= 0) {
setActiveItemIndex(activeItemIndex - 1);
}
break;
}
case 38: {
if (activeItemIndex - step >= 0) {
setActiveItemIndex(activeItemIndex - step);
}
break;
}
case 9:
case 39: {
if (activeItemIndex + 1 < itemCount) {
setActiveItemIndex(activeItemIndex + 1);
}
break;
}
case 40: {
if (activeItemIndex + step < itemCount) {
setActiveItemIndex(activeItemIndex + step);
}
break;
}
default: {
return;
}
}
};
return _this;
}
ExploreDatasetSection.prototype.componentDidMount = function () {
var _a = this.props, initialState = _a.initialState, initState = _a.initState;
initState(initialState);
window.addEventListener('keydown', this.handleKeyDown);
};
ExploreDatasetSection.prototype.componentWillUnmount = function () {
window.removeEventListener('keydown', this.handleKeyDown);
};
ExploreDatasetSection.prototype.componentWillReceiveProps = function (nextProps) {
var setData = nextProps.setData, setImageField = nextProps.setImageField, setKeyField = nextProps.setKeyField, startLoading = nextProps.startLoading, finishLoading = nextProps.finishLoading;
if (!lodash_1.isEqual(this.props.dataset.data, nextProps.initialState.data)) {
setData(nextProps.initialState.data);
}
if (!lodash_1.isEqual(this.props.dataset.keyField, nextProps.initialState.keyField)) {
setKeyField(nextProps.initialState.keyField);
}
if (!lodash_1.isEqual(this.props.dataset.imageField, nextProps.initialState.imageField)) {
setImageField(nextProps.initialState.imageField);
}
if (!lodash_1.isEqual(this.props.dataset.loading, nextProps.initialState.loading)) {
if (nextProps.initialState.loading) {
startLoading();
}
else {
finishLoading();
}
}
};
ExploreDatasetSection.prototype.render = function () {
var _a = this.props, dataset = _a.dataset, classNames = _a.classNames, onItemClick = _a.onItemClick, setShowDetail = _a.setShowDetail;
return (React.createElement("div", { className: cx(classNames.concat(styles['ExploreDatasetSection'])) },
React.createElement("div", { className: styles['title'] }, "Explore your dataset"),
dataset.loading &&
React.createElement("div", { className: styles['loading'] }, "Loading..."),
!dataset.loading && !lodash_1.isEmpty(dataset.data) &&
React.createElement("div", { className: styles['message'] }, dataset.data.count + " items in your dataset." + (dataset.data.count > 100 ? ' First 100 shown.' : '')),
!dataset.loading && this.hasData() && !lodash_1.isEmpty(dataset.imageField) &&
React.createElement(ImageItemGrid_1.default, { data: dataset.data, imageField: dataset.imageField, keyField: dataset.keyField, activeItemIndex: dataset.activeItemIndex, onItemClick: onItemClick }),
!dataset.loading && this.hasData() && lodash_1.isEmpty(dataset.imageField) &&
React.createElement(ListItemGrid_1.default, { data: dataset.data, keyField: dataset.keyField, activeItemIndex: dataset.activeItemIndex, onItemClick: onItemClick }),
this.hasData() &&
React.createElement(DetailPanel_1.default, { item: dataset.data.items[dataset.activeItemIndex], imageField: dataset.imageField, showDetail: dataset.showDetail, setShowDetail: setShowDetail })));
};
ExploreDatasetSection.prototype.hasData = function () {
var dataset = this.props.dataset;
return !lodash_1.isEmpty(dataset.data) && !lodash_1.isEmpty(dataset.data.items);
};
return ExploreDatasetSection;
}(React.Component));
ExploreDatasetSection.defaultProps = {
initialState: null,
classNames: [],
dataset: exploreDataset_1.initialState,
initState: function () { return undefined; },
setData: function () { return undefined; },
setImageField: function () { return undefined; },
setKeyField: function () { return undefined; },
setShowDetail: function () { return undefined; },
setActiveItemIndex: function () { return undefined; },
startLoading: function () { return undefined; },
finishLoading: function () { return undefined; },
onItemClick: function () { return undefined; },
};
var mapStateToProps = function (state, ownProps) {
return {
dataset: state,
};
};
exports.default = react_redux_1.connect(mapStateToProps, exploreDatasetActions_1.actions)(ExploreDatasetSection);
/***/ }),
/* 23 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = __webpack_require__(0);
var react_redux_1 = __webpack_require__(6);
var redux_1 = __webpack_require__(7);
var applyMiddlewares_1 = __webpack_require__(44);
var ExploreDatasetSection_1 = __webpack_require__(22);
var exploreDataset_1 = __webpack_require__(4);
var exploreDatasetReducer_1 = __webpack_require__(42);
var ExploreDatasetSectionWrapper = (function (_super) {
__extends(ExploreDatasetSectionWrapper, _super);
function ExploreDatasetSectionWrapper(props) {
return _super.call(this, props) || this;
}
ExploreDatasetSectionWrapper.prototype.componentWillMount = function () {
this.exploreDatasetStore = redux_1.createStore(exploreDatasetReducer_1.default, exploreDataset_1.initialState, applyMiddlewares_1.default());
};
ExploreDatasetSectionWrapper.prototype.componentWillUnmount = function () {
this.exploreDatasetStore = null;
};
ExploreDatasetSectionWrapper.prototype.render = function () {
var _a = this.props, classNames = _a.classNames, initialState = _a.initialState;
return (React.createElement(react_redux_1.Provider, { store: this.exploreDatasetStore },
React.createElement(ExploreDatasetSection_1.default, { initialState: initialState, classNames: classNames })));
};
return ExploreDatasetSectionWrapper;
}(React.Component));
ExploreDatasetSectionWrapper.defaultProps = {
initialState: exploreDataset_1.initialState,
classNames: [],
};
exports.ExploreDatasetSectionWrapper = ExploreDatasetSectionWrapper;
/***/ }),
/* 24 */
/***/ (function(module, exports, __webpack_require__) {
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = __webpack_require__(0);
var cx = __webpack_require__(2);
var Isvg = __webpack_require__(73);
var lodash_1 = __webpack_require__(1);
var lib_1 = __webpack_require__(3);
var styles = {};
if (typeof window !== 'undefined') {
styles = __webpack_require__(52);
}
var Icon = (function (_super) {
__extends(Icon, _super);
function Icon(props) {
var _this = _super.call(this, props) || this;
_this.handleMouseEnter = function () {
_this.setState({
hover: true,
});
};
_this.handleMouseLeave = function () {
_this.setState({
hover: false,
});
};
_this.tooltipId = lodash_1.uniqueId('tooltip');
_this.state = {
hover: false,
};
return _this;
}
Icon.prototype.render = function () {
var _a = this.props, classNames = _a.classNames, width = _a.width, height = _a.height, onClick = _a.onClick, onMouseDown = _a.onMouseDown, border = _a.border, tooltip = _a.tooltip;
var wrapperStyle = {
height: height + 'px',
width: width + 'px',
border: border ? undefined : 'none',
};
var showTooltip = !lodash_1.isEmpty(tooltip);
return (React.createElement("div", { tabIndex: 0, onClick: onClick, onMouseDown: onMouseDown, onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave, className: cx(classNames.concat(styles['icon'])), style: wrapperStyle, "data-tip": showTooltip, "data-for": this.tooltipId },
this.generateIcon(),
showTooltip && React.createElement(lib_1.Tooltip, { id: this.tooltipId, text: tooltip })));
};
Icon.prototype.generateIcon = function () {
var _a = this.props, src = _a.src, active = _a.active, activeFill = _a.activeFill;
var hover = this.state.hover;
return (React.createElement(Isvg, { key: src, src: src, className: cx((_b = {},
_b[styles['active']] = active,
_b[styles['hover']] = hover,
_b[styles[activeFill]] = true,
_b)) }));
var _b;
};
return Icon;
}(React.Component));
Icon.defaultProps = {
src: '',
width: 24,
height: 24,
classNames: [],
onClick: function () { return undefined; },
onMouseDown: function () { return undefined; },
border: true,
tooltip: '',
active: false,
activeFill: 'purple',
};
exports.Icon = Icon;
/***/ }),
/* 25 */
/***/ (function(modul