Skip to content

Instantly share code, notes, and snippets.

@nathanmarks
Created July 19, 2016 13:32
Show Gist options
  • Save nathanmarks/3f5196f5973e3ff7807f2bab4e603a37 to your computer and use it in GitHub Desktop.
Save nathanmarks/3f5196f5973e3ff7807f2bab4e603a37 to your computer and use it in GitHub Desktop.
This file has been truncated, but you can view the full file.
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory(require("react"), require("react-dom"), require("react-addons-transition-group"), require("react-addons-create-fragment"));
else if(typeof define === 'function' && define.amd)
define(["react", "react-dom", "react-addons-transition-group", "react-addons-create-fragment"], factory);
else if(typeof exports === 'object')
exports["MaterialUI"] = factory(require("react"), require("react-dom"), require("react-addons-transition-group"), require("react-addons-create-fragment"));
else
root["MaterialUI"] = factory(root["React"], root["ReactDOM"], root["React"]["addons"]["TransitionGroup"], root["React"]["addons"]["createFragment"]);
})(this, function(__WEBPACK_EXTERNAL_MODULE_1__, __WEBPACK_EXTERNAL_MODULE_4__, __WEBPACK_EXTERNAL_MODULE_26__, __WEBPACK_EXTERNAL_MODULE_272__) {
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] = {
/******/ exports: {},
/******/ id: moduleId,
/******/ loaded: false
/******/ };
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/ // Flag the module as loaded
/******/ module.loaded = 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;
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "";
/******/ // Load entry module and return exports
/******/ return __webpack_require__(0);
/******/ })
/************************************************************************/
/******/ ([
/* 0 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _index = __webpack_require__(184);
Object.keys(_index).forEach(function (key) {
if (key === "default") return;
Object.defineProperty(exports, key, {
enumerable: true,
get: function get() {
return _index[key];
}
});
});
var _styles = __webpack_require__(195);
Object.keys(_styles).forEach(function (key) {
if (key === "default") return;
Object.defineProperty(exports, key, {
enumerable: true,
get: function get() {
return _styles[key];
}
});
});
var _reactTapEventPlugin = __webpack_require__(255);
var _reactTapEventPlugin2 = _interopRequireDefault(_reactTapEventPlugin);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
(0, _reactTapEventPlugin2.default)();
/***/ },
/* 1 */
/***/ function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_1__;
/***/ },
/* 2 */
/***/ function(module, exports) {
module.exports = function (target) {
for (var i = 1; i < arguments.length; i++) {
var source = arguments[i];
for (var key in source) {
if (Object.prototype.hasOwnProperty.call(source, key)) {
target[key] = source[key];
}
}
}
return target;
};
/***/ },
/* 3 */
/***/ function(module, exports) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = {
easeOutFunction: 'cubic-bezier(0.23, 1, 0.32, 1)',
easeInOutFunction: 'cubic-bezier(0.445, 0.05, 0.55, 0.95)',
easeOut: function easeOut(duration, property, delay, easeFunction) {
easeFunction = easeFunction || this.easeOutFunction;
if (property && Object.prototype.toString.call(property) === '[object Array]') {
var transitions = '';
for (var i = 0; i < property.length; i++) {
if (transitions) transitions += ',';
transitions += this.create(duration, property[i], delay, easeFunction);
}
return transitions;
} else {
return this.create(duration, property, delay, easeFunction);
}
},
create: function create(duration, property, delay, easeFunction) {
duration = duration || '450ms';
property = property || 'all';
delay = delay || '0ms';
easeFunction = easeFunction || 'linear';
return property + ' ' + duration + ' ' + easeFunction + ' ' + delay;
}
};
/***/ },
/* 4 */
/***/ function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_4__;
/***/ },
/* 5 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _SvgIcon = __webpack_require__(161);
var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _SvgIcon2.default;
/***/ },
/* 6 */
/***/ function(module, exports, __webpack_require__) {
/**
* Copyright 2014-2015, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*/
'use strict';
/**
* Similar to invariant but only logs a warning if the condition is not met.
* This can be used to log issues in development environments in critical
* paths. Removing the logging code for production environments will keep the
* same logic and follow the same code paths.
*/
var warning = function() {};
if (true) {
warning = function(condition, format, args) {
var len = arguments.length;
args = new Array(len > 2 ? len - 2 : 0);
for (var key = 2; key < len; key++) {
args[key - 2] = arguments[key];
}
if (format === undefined) {
throw new Error(
'`warning(condition, format, ...args)` requires a warning ' +
'message argument'
);
}
if (format.length < 10 || (/^[s\W]*$/).test(format)) {
throw new Error(
'The warning format should be able to uniquely identify this ' +
'warning. Please, use a more descriptive format than: ' + format
);
}
if (!condition) {
var argIndex = 0;
var message = 'Warning: ' +
format.replace(/%s/g, function() {
return args[argIndex++];
});
if (typeof console !== 'undefined') {
console.error(message);
}
try {
// This error was thrown as a convenience so that you can use this stack
// to find the callsite that caused this warning to fire.
throw new Error(message);
} catch(x) {}
}
};
}
module.exports = warning;
/***/ },
/* 7 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
exports.__esModule = true;
var _shouldUpdate = __webpack_require__(269);
var _shouldUpdate2 = _interopRequireDefault(_shouldUpdate);
var _shallowEqual = __webpack_require__(16);
var _shallowEqual2 = _interopRequireDefault(_shallowEqual);
var _createHelper = __webpack_require__(97);
var _createHelper2 = _interopRequireDefault(_createHelper);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var pure = (0, _shouldUpdate2.default)(function (props, nextProps) {
return !(0, _shallowEqual2.default)(props, nextProps);
});
exports.default = (0, _createHelper2.default)(pure, 'pure', true, true);
/***/ },
/* 8 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _Paper = __webpack_require__(140);
var _Paper2 = _interopRequireDefault(_Paper);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _Paper2.default;
/***/ },
/* 9 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = __webpack_require__(1);
var horizontal = _react.PropTypes.oneOf(['left', 'middle', 'right']);
var vertical = _react.PropTypes.oneOf(['top', 'center', 'bottom']);
exports.default = {
corners: _react.PropTypes.oneOf(['bottom-left', 'bottom-right', 'top-left', 'top-right']),
horizontal: horizontal,
vertical: vertical,
origin: _react.PropTypes.shape({
horizontal: horizontal,
vertical: vertical
}),
cornersAndCenter: _react.PropTypes.oneOf(['bottom-center', 'bottom-left', 'bottom-right', 'top-center', 'top-left', 'top-right']),
stringOrNumber: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.number]),
zDepth: _react.PropTypes.oneOf([0, 1, 2, 3, 4, 5])
};
/***/ },
/* 10 */
/***/ function(module, exports) {
// Source: http://jsfiddle.net/vWx8V/
// http://stackoverflow.com/questions/5603195/full-list-of-javascript-keycodes
/**
* Conenience method returns corresponding value for given keyName or keyCode.
*
* @param {Mixed} keyCode {Number} or keyName {String}
* @return {Mixed}
* @api public
*/
exports = module.exports = function(searchInput) {
// Keyboard Events
if (searchInput && 'object' === typeof searchInput) {
var hasKeyCode = searchInput.which || searchInput.keyCode || searchInput.charCode
if (hasKeyCode) searchInput = hasKeyCode
}
// Numbers
if ('number' === typeof searchInput) return names[searchInput]
// Everything else (cast to string)
var search = String(searchInput)
// check codes
var foundNamedKey = codes[search.toLowerCase()]
if (foundNamedKey) return foundNamedKey
// check aliases
var foundNamedKey = aliases[search.toLowerCase()]
if (foundNamedKey) return foundNamedKey
// weird character?
if (search.length === 1) return search.charCodeAt(0)
return undefined
}
/**
* Get by name
*
* exports.code['enter'] // => 13
*/
var codes = exports.code = exports.codes = {
'backspace': 8,
'tab': 9,
'enter': 13,
'shift': 16,
'ctrl': 17,
'alt': 18,
'pause/break': 19,
'caps lock': 20,
'esc': 27,
'space': 32,
'page up': 33,
'page down': 34,
'end': 35,
'home': 36,
'left': 37,
'up': 38,
'right': 39,
'down': 40,
'insert': 45,
'delete': 46,
'command': 91,
'left command': 91,
'right command': 93,
'numpad *': 106,
'numpad +': 107,
'numpad -': 109,
'numpad .': 110,
'numpad /': 111,
'num lock': 144,
'scroll lock': 145,
'my computer': 182,
'my calculator': 183,
';': 186,
'=': 187,
',': 188,
'-': 189,
'.': 190,
'/': 191,
'`': 192,
'[': 219,
'\\': 220,
']': 221,
"'": 222
}
// Helper aliases
var aliases = exports.aliases = {
'windows': 91,
'⇧': 16,
'⌥': 18,
'⌃': 17,
'⌘': 91,
'ctl': 17,
'control': 17,
'option': 18,
'pause': 19,
'break': 19,
'caps': 20,
'return': 13,
'escape': 27,
'spc': 32,
'pgup': 33,
'pgdn': 34,
'ins': 45,
'del': 46,
'cmd': 91
}
/*!
* Programatically add the following
*/
// lower case chars
for (i = 97; i < 123; i++) codes[String.fromCharCode(i)] = i - 32
// numbers
for (var i = 48; i < 58; i++) codes[i - 48] = i
// function keys
for (i = 1; i < 13; i++) codes['f'+i] = i + 111
// numpad keys
for (i = 0; i < 10; i++) codes['numpad '+i] = i + 96
/**
* Get by code
*
* exports.name[13] // => 'Enter'
*/
var names = exports.names = exports.title = {} // title for backward compat
// Create reverse mapping
for (i in codes) names[codes[i]] = i
// Add aliases
for (var alias in aliases) {
codes[alias] = aliases[alias]
}
/***/ },
/* 11 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _childUtils = __webpack_require__(24);
var _events = __webpack_require__(47);
var _events2 = _interopRequireDefault(_events);
var _keycode = __webpack_require__(10);
var _keycode2 = _interopRequireDefault(_keycode);
var _FocusRipple = __webpack_require__(43);
var _FocusRipple2 = _interopRequireDefault(_FocusRipple);
var _TouchRipple = __webpack_require__(83);
var _TouchRipple2 = _interopRequireDefault(_TouchRipple);
var _deprecatedPropType = __webpack_require__(15);
var _deprecatedPropType2 = _interopRequireDefault(_deprecatedPropType);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var styleInjected = false;
var listening = false;
var tabPressed = false;
function injectStyle() {
if (!styleInjected) {
// Remove inner padding and border in Firefox 4+.
var style = document.createElement('style');
style.innerHTML = '\n button::-moz-focus-inner,\n input::-moz-focus-inner {\n border: 0;\n padding: 0;\n }\n ';
document.body.appendChild(style);
styleInjected = true;
}
}
function listenForTabPresses() {
if (!listening) {
_events2.default.on(window, 'keydown', function (event) {
tabPressed = (0, _keycode2.default)(event) === 'tab';
});
listening = true;
}
}
var EnhancedButton = function (_Component) {
_inherits(EnhancedButton, _Component);
function EnhancedButton() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, EnhancedButton);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(EnhancedButton)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = { isKeyboardFocused: false }, _this.handleKeyDown = function (event) {
if (!_this.props.disabled && !_this.props.disableKeyboardFocus) {
if ((0, _keycode2.default)(event) === 'enter' && _this.state.isKeyboardFocused) {
_this.handleTouchTap(event);
}
if ((0, _keycode2.default)(event) === 'esc' && _this.state.isKeyboardFocused) {
_this.removeKeyboardFocus(event);
}
}
_this.props.onKeyDown(event);
}, _this.handleKeyUp = function (event) {
if (!_this.props.disabled && !_this.props.disableKeyboardFocus) {
if ((0, _keycode2.default)(event) === 'space' && _this.state.isKeyboardFocused) {
_this.handleTouchTap(event);
}
}
_this.props.onKeyUp(event);
}, _this.handleBlur = function (event) {
_this.cancelFocusTimeout();
_this.removeKeyboardFocus(event);
_this.props.onBlur(event);
}, _this.handleFocus = function (event) {
if (event) event.persist();
if (!_this.props.disabled && !_this.props.disableKeyboardFocus) {
// setTimeout is needed because the focus event fires first
// Wait so that we can capture if this was a keyboard focus
// or touch focus
_this.focusTimeout = setTimeout(function () {
if (tabPressed) {
_this.setKeyboardFocus(event);
tabPressed = false;
}
}, 150);
_this.props.onFocus(event);
}
}, _this.handleClick = function (event) {
if (!_this.props.disabled) {
tabPressed = false;
_this.props.onClick(event);
}
}, _this.handleTouchTap = function (event) {
_this.cancelFocusTimeout();
if (!_this.props.disabled) {
tabPressed = false;
_this.removeKeyboardFocus(event);
_this.props.onTouchTap(event);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(EnhancedButton, [{
key: 'componentWillMount',
value: function componentWillMount() {
var _props = this.props;
var disabled = _props.disabled;
var disableKeyboardFocus = _props.disableKeyboardFocus;
var keyboardFocused = _props.keyboardFocused;
if (!disabled && keyboardFocused && !disableKeyboardFocus) {
this.setState({ isKeyboardFocused: true });
}
}
}, {
key: 'componentDidMount',
value: function componentDidMount() {
injectStyle();
listenForTabPresses();
if (this.state.isKeyboardFocused) {
this.refs.enhancedButton.focus();
this.props.onKeyboardFocus(null, true);
}
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if ((nextProps.disabled || nextProps.disableKeyboardFocus) && this.state.isKeyboardFocused) {
this.setState({ isKeyboardFocused: false });
if (nextProps.onKeyboardFocus) {
nextProps.onKeyboardFocus(null, false);
}
}
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
clearTimeout(this.focusTimeout);
}
}, {
key: 'isKeyboardFocused',
value: function isKeyboardFocused() {
return this.state.isKeyboardFocused;
}
}, {
key: 'removeKeyboardFocus',
value: function removeKeyboardFocus(event) {
if (this.state.isKeyboardFocused) {
this.setState({ isKeyboardFocused: false });
this.props.onKeyboardFocus(event, false);
}
}
}, {
key: 'setKeyboardFocus',
value: function setKeyboardFocus(event) {
if (!this.state.isKeyboardFocused) {
this.setState({ isKeyboardFocused: true });
this.props.onKeyboardFocus(event, true);
}
}
}, {
key: 'cancelFocusTimeout',
value: function cancelFocusTimeout() {
if (this.focusTimeout) {
clearTimeout(this.focusTimeout);
this.focusTimeout = null;
}
}
}, {
key: 'createButtonChildren',
value: function createButtonChildren() {
var _props2 = this.props;
var centerRipple = _props2.centerRipple;
var children = _props2.children;
var disabled = _props2.disabled;
var disableFocusRipple = _props2.disableFocusRipple;
var disableKeyboardFocus = _props2.disableKeyboardFocus;
var disableTouchRipple = _props2.disableTouchRipple;
var focusRippleColor = _props2.focusRippleColor;
var focusRippleOpacity = _props2.focusRippleOpacity;
var touchRippleColor = _props2.touchRippleColor;
var touchRippleOpacity = _props2.touchRippleOpacity;
var isKeyboardFocused = this.state.isKeyboardFocused;
// Focus Ripple
var focusRipple = isKeyboardFocused && !disabled && !disableFocusRipple && !disableKeyboardFocus ? _react2.default.createElement(_FocusRipple2.default, {
color: focusRippleColor,
opacity: focusRippleOpacity,
show: isKeyboardFocused
}) : undefined;
// Touch Ripple
var touchRipple = !disabled && !disableTouchRipple ? _react2.default.createElement(
_TouchRipple2.default,
{
centerRipple: centerRipple,
color: touchRippleColor,
opacity: touchRippleOpacity
},
children
) : undefined;
return (0, _childUtils.createChildFragment)({
focusRipple: focusRipple,
touchRipple: touchRipple,
children: touchRipple ? undefined : children
});
}
}, {
key: 'render',
value: function render() {
var _props3 = this.props;
var centerRipple = _props3.centerRipple;
var // eslint-disable-line no-unused-vars
children = _props3.children;
var containerElement = _props3.containerElement;
var disabled = _props3.disabled;
var disableFocusRipple = _props3.disableFocusRipple;
var disableKeyboardFocus = _props3.disableKeyboardFocus;
var // eslint-disable-line no-unused-vars
disableTouchRipple = _props3.disableTouchRipple;
var // eslint-disable-line no-unused-vars
focusRippleColor = _props3.focusRippleColor;
var // eslint-disable-line no-unused-vars
focusRippleOpacity = _props3.focusRippleOpacity;
var // eslint-disable-line no-unused-vars
href = _props3.href;
var linkButton = _props3.linkButton;
var // eslint-disable-line no-unused-vars
touchRippleColor = _props3.touchRippleColor;
var // eslint-disable-line no-unused-vars
touchRippleOpacity = _props3.touchRippleOpacity;
var // eslint-disable-line no-unused-vars
onBlur = _props3.onBlur;
var // eslint-disable-line no-unused-vars
onClick = _props3.onClick;
var // eslint-disable-line no-unused-vars
onFocus = _props3.onFocus;
var // eslint-disable-line no-unused-vars
onKeyUp = _props3.onKeyUp;
var // eslint-disable-line no-unused-vars
onKeyDown = _props3.onKeyDown;
var // eslint-disable-line no-unused-vars
onTouchTap = _props3.onTouchTap;
var // eslint-disable-line no-unused-vars
style = _props3.style;
var tabIndex = _props3.tabIndex;
var type = _props3.type;
var other = _objectWithoutProperties(_props3, ['centerRipple', 'children', 'containerElement', 'disabled', 'disableFocusRipple', 'disableKeyboardFocus', 'disableTouchRipple', 'focusRippleColor', 'focusRippleOpacity', 'href', 'linkButton', 'touchRippleColor', 'touchRippleOpacity', 'onBlur', 'onClick', 'onFocus', 'onKeyUp', 'onKeyDown', 'onTouchTap', 'style', 'tabIndex', 'type']);
var _context$muiTheme = this.context.muiTheme;
var prepareStyles = _context$muiTheme.prepareStyles;
var enhancedButton = _context$muiTheme.enhancedButton;
var mergedStyles = (0, _simpleAssign2.default)({
border: 10,
boxSizing: 'border-box',
display: 'inline-block',
fontFamily: this.context.muiTheme.baseTheme.fontFamily,
WebkitTapHighlightColor: enhancedButton.tapHighlightColor, // Remove mobile color flashing (deprecated)
cursor: disabled ? 'default' : 'pointer',
textDecoration: 'none',
margin: 0,
padding: 0,
outline: 'none',
fontSize: 'inherit',
fontWeight: 'inherit',
/**
* This is needed so that ripples do not bleed
* past border radius.
* See: http://stackoverflow.com/questions/17298739/
* css-overflow-hidden-not-working-in-chrome-when-parent-has-border-radius-and-chil
*/
transform: disableTouchRipple && disableFocusRipple ? null : 'translate3d(0, 0, 0)',
verticalAlign: other.hasOwnProperty('href') ? 'middle' : null
}, style);
// Passing both background:none & backgroundColor can break due to object iteration order
if (!mergedStyles.backgroundColor && !mergedStyles.background) {
mergedStyles.background = 'none';
}
if (disabled && href) {
return _react2.default.createElement(
'span',
_extends({}, other, {
style: mergedStyles
}),
children
);
}
var buttonProps = _extends({}, other, {
style: prepareStyles(mergedStyles),
ref: 'enhancedButton',
disabled: disabled,
href: href,
onBlur: this.handleBlur,
onClick: this.handleClick,
onFocus: this.handleFocus,
onTouchTap: this.handleTouchTap,
onKeyUp: this.handleKeyUp,
onKeyDown: this.handleKeyDown,
tabIndex: tabIndex,
type: type
});
var buttonChildren = this.createButtonChildren();
return _react2.default.isValidElement(containerElement) ? _react2.default.cloneElement(containerElement, buttonProps, buttonChildren) : _react2.default.createElement(href ? 'a' : containerElement, buttonProps, buttonChildren);
}
}]);
return EnhancedButton;
}(_react.Component);
EnhancedButton.propTypes = {
centerRipple: _react.PropTypes.bool,
children: _react.PropTypes.node,
containerElement: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.element]),
disableFocusRipple: _react.PropTypes.bool,
disableKeyboardFocus: _react.PropTypes.bool,
disableTouchRipple: _react.PropTypes.bool,
disabled: _react.PropTypes.bool,
focusRippleColor: _react.PropTypes.string,
focusRippleOpacity: _react.PropTypes.number,
href: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.bool]),
keyboardFocused: _react.PropTypes.bool,
linkButton: (0, _deprecatedPropType2.default)(_react.PropTypes.bool, 'LinkButton is no longer required when the `href` property is provided.'),
onBlur: _react.PropTypes.func,
onClick: _react.PropTypes.func,
onFocus: _react.PropTypes.func,
onKeyDown: _react.PropTypes.func,
onKeyUp: _react.PropTypes.func,
onKeyboardFocus: _react.PropTypes.func,
onMouseDown: _react.PropTypes.func,
onMouseEnter: _react.PropTypes.func,
onMouseLeave: _react.PropTypes.func,
onMouseUp: _react.PropTypes.func,
onTouchEnd: _react.PropTypes.func,
onTouchStart: _react.PropTypes.func,
onTouchTap: _react.PropTypes.func,
style: _react.PropTypes.object,
tabIndex: _react.PropTypes.number,
touchRippleColor: _react.PropTypes.string,
touchRippleOpacity: _react.PropTypes.number,
type: _react.PropTypes.string
};
EnhancedButton.defaultProps = {
containerElement: 'button',
onBlur: function onBlur() {},
onClick: function onClick() {},
onFocus: function onFocus() {},
onKeyDown: function onKeyDown() {},
onKeyUp: function onKeyUp() {},
onKeyboardFocus: function onKeyboardFocus() {},
onMouseDown: function onMouseDown() {},
onMouseEnter: function onMouseEnter() {},
onMouseLeave: function onMouseLeave() {},
onMouseUp: function onMouseUp() {},
onTouchEnd: function onTouchEnd() {},
onTouchStart: function onTouchStart() {},
onTouchTap: function onTouchTap() {},
tabIndex: 0,
type: 'button'
};
EnhancedButton.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = EnhancedButton;
/***/ },
/* 12 */
/***/ function(module, exports) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.convertColorToString = convertColorToString;
exports.convertHexToRGB = convertHexToRGB;
exports.decomposeColor = decomposeColor;
exports.getContrastRatio = getContrastRatio;
exports.getLuminance = getLuminance;
exports.emphasize = emphasize;
exports.fade = fade;
exports.darken = darken;
exports.lighten = lighten;
/**
* Returns a number whose value is limited to the given range.
*
* @param {number} value The value to be clamped
* @param {number} min The lower boundary of the output range
* @param {number} max The upper boundary of the output range
* @returns {number} A number in the range [min, max]
*/
function clamp(value, min, max) {
if (value < min) {
return min;
}
if (value > max) {
return max;
}
return value;
}
/**
* Converts a color object with type and values to a string.
*
* @param {object} color - Decomposed color
* @param {string} color.type - One of, 'rgb', 'rgba', 'hsl', 'hsla'
* @param {array} color.values - [n,n,n] or [n,n,n,n]
* @returns {string} A CSS color string
*/
function convertColorToString(color) {
var type = color.type;
var values = color.values;
if (type.indexOf('rgb') > -1) {
// Only convert the first 3 values to int (i.e. not alpha)
for (var i = 0; i < 3; i++) {
values[i] = parseInt(values[i]);
}
}
var colorString = void 0;
if (type.indexOf('hsl') > -1) {
colorString = color.type + '(' + values[0] + ', ' + values[1] + '%, ' + values[2] + '%';
} else {
colorString = color.type + '(' + values[0] + ', ' + values[1] + ', ' + values[2];
}
if (values.length === 4) {
colorString += ', ' + color.values[3] + ')';
} else {
colorString += ')';
}
return colorString;
}
/**
* Converts a color from CSS hex format to CSS rgb format.
*
* @param {string} color - Hex color, i.e. #nnn or #nnnnnn
* @returns {string} A CSS rgb color string
*/
function convertHexToRGB(color) {
if (color.length === 4) {
var extendedColor = '#';
for (var i = 1; i < color.length; i++) {
extendedColor += color.charAt(i) + color.charAt(i);
}
color = extendedColor;
}
var values = {
r: parseInt(color.substr(1, 2), 16),
g: parseInt(color.substr(3, 2), 16),
b: parseInt(color.substr(5, 2), 16)
};
return 'rgb(' + values.r + ', ' + values.g + ', ' + values.b + ')';
}
/**
* Returns an object with the type and values of a color.
*
* Note: Does not support rgb % values.
*
* @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
* @returns {{type: string, values: number[]}} A MUI color object
*/
function decomposeColor(color) {
if (color.charAt(0) === '#') {
return decomposeColor(convertHexToRGB(color));
}
var marker = color.indexOf('(');
var type = color.substring(0, marker);
var values = color.substring(marker + 1, color.length - 1).split(',');
values = values.map(function (value) {
return parseFloat(value);
});
return { type: type, values: values };
}
/**
* Calculates the contrast ratio between two colors.
*
* Formula: http://www.w3.org/TR/2008/REC-WCAG20-20081211/#contrast-ratiodef
*
* @param {string} foreground - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
* @param {string} background - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
* @returns {number} A contrast ratio value in the range 0 - 21 with 2 digit precision.
*/
function getContrastRatio(foreground, background) {
var lumA = getLuminance(foreground);
var lumB = getLuminance(background);
var contrastRatio = (Math.max(lumA, lumB) + 0.05) / (Math.min(lumA, lumB) + 0.05);
return Number(contrastRatio.toFixed(2)); // Truncate at two digits
}
/**
* The relative brightness of any point in a color space,
* normalized to 0 for darkest black and 1 for lightest white.
*
* Formula: https://www.w3.org/WAI/GL/wiki/Relative_luminance
*
* @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
* @returns {number} The relative brightness of the color in the range 0 - 1
*/
function getLuminance(color) {
color = decomposeColor(color);
if (color.type.indexOf('rgb') > -1) {
var rgb = color.values.map(function (val) {
val /= 255; // normalized
return val <= 0.03928 ? val / 12.92 : Math.pow((val + 0.055) / 1.055, 2.4);
});
return Number((0.2126 * rgb[0] + 0.7152 * rgb[1] + 0.0722 * rgb[2]).toFixed(3)); // Truncate at 3 digits
} else if (color.type.indexOf('hsl') > -1) {
return color.values[2] / 100;
}
}
/**
* Darken or lighten a colour, depending on its luminance.
* Light colors are darkened, dark colors are lightened.
*
* @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
* @param {number} coefficient=0.15 - multiplier in the range 0 - 1
* @returns {string} A CSS color string. Hex input values are returned as rgb
*/
function emphasize(color) {
var coefficient = arguments.length <= 1 || arguments[1] === undefined ? 0.15 : arguments[1];
return getLuminance(color) > 0.5 ? darken(color, coefficient) : lighten(color, coefficient);
}
/**
* Set the absolute transparency of a color.
* Any existing alpha values are overwritten.
*
* @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
* @param {number} value - value to set the alpha channel to in the range 0 -1
* @returns {string} A CSS color string. Hex input values are returned as rgb
*/
function fade(color, value) {
color = decomposeColor(color);
value = clamp(value, 0, 1);
if (color.type === 'rgb' || color.type === 'hsl') {
color.type += 'a';
}
color.values[3] = value;
return convertColorToString(color);
}
/**
* Darkens a color.
*
* @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
* @param {number} coefficient - multiplier in the range 0 - 1
* @returns {string} A CSS color string. Hex input values are returned as rgb
*/
function darken(color, coefficient) {
color = decomposeColor(color);
coefficient = clamp(coefficient, 0, 1);
if (color.type.indexOf('hsl') > -1) {
color.values[2] *= 1 - coefficient;
} else if (color.type.indexOf('rgb') > -1) {
for (var i = 0; i < 3; i++) {
color.values[i] *= 1 - coefficient;
}
}
return convertColorToString(color);
}
/**
* Lightens a color.
*
* @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
* @param {number} coefficient - multiplier in the range 0 - 1
* @returns {string} A CSS color string. Hex input values are returned as rgb
*/
function lighten(color, coefficient) {
color = decomposeColor(color);
coefficient = clamp(coefficient, 0, 1);
if (color.type.indexOf('hsl') > -1) {
color.values[2] += (100 - color.values[2]) * coefficient;
} else if (color.type.indexOf('rgb') > -1) {
for (var i = 0; i < 3; i++) {
color.values[i] += (255 - color.values[i]) * coefficient;
}
}
return convertColorToString(color);
}
/***/ },
/* 13 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _shallowEqual = __webpack_require__(249);
var _shallowEqual2 = _interopRequireDefault(_shallowEqual);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function on(target, eventName, callback, capture) {
if (target.addEventListener) {
target.addEventListener(eventName, callback, capture);
} else if (target.attachEvent) {
// IE8+ Support
target.attachEvent('on' + eventName, function () {
callback.call(target);
});
}
}
function off(target, eventName, callback, capture) {
if (target.removeEventListener) {
target.removeEventListener(eventName, callback, capture);
} else if (target.detachEvent) {
// IE8+ Support
target.detachEvent('on' + eventName, callback);
}
}
function forEachListener(props, iteratee) {
for (var name in props) {
if (name.substring(0, 2) === 'on' && props[name] instanceof Function) {
var _eventName = name.substring(2).toLowerCase();
iteratee(_eventName, props[name]);
}
}
}
var EventListener = function (_Component) {
_inherits(EventListener, _Component);
function EventListener() {
_classCallCheck(this, EventListener);
return _possibleConstructorReturn(this, Object.getPrototypeOf(EventListener).apply(this, arguments));
}
_createClass(EventListener, [{
key: 'componentDidMount',
value: function componentDidMount() {
this.addListeners();
}
}, {
key: 'shouldComponentUpdate',
value: function shouldComponentUpdate(nextProps) {
return !(0, _shallowEqual2.default)(this.props, nextProps);
}
}, {
key: 'componentWillUpdate',
value: function componentWillUpdate() {
this.removeListeners();
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
this.addListeners();
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
this.removeListeners();
}
}, {
key: 'addListeners',
value: function addListeners() {
var _this2 = this;
var _props = this.props;
var capture = _props.capture;
var target = _props.target;
if (target) {
(function () {
var element = target;
if (typeof target === 'string') {
element = window[target];
}
forEachListener(_this2.props, function (eventName, listener) {
return on(element, eventName, listener, capture);
});
})();
}
}
}, {
key: 'removeListeners',
value: function removeListeners() {
var _this3 = this;
var _props2 = this.props;
var capture = _props2.capture;
var target = _props2.target;
if (target) {
(function () {
var element = target;
if (typeof target === 'string') {
element = window[target];
}
forEachListener(_this3.props, function (eventName, listener) {
return off(element, eventName, listener, capture);
});
})();
}
}
}, {
key: 'render',
value: function render() {
return this.props.children || null;
}
}]);
return EventListener;
}(_react.Component);
EventListener.propTypes = {
/**
* Whether to use capturing listeners.
*/
capture: _react.PropTypes.bool.isRequired,
/**
* You can provide a children too.
*/
children: _react.PropTypes.node,
/**
* The DOM target to listen to.
*/
target: _react2.default.PropTypes.oneOfType([_react2.default.PropTypes.object, _react2.default.PropTypes.string])
};
EventListener.defaultProps = {
capture: false
};
exports.default = EventListener;
/***/ },
/* 14 */
/***/ function(module, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = {
set: function set(style, key, value) {
style[key] = value;
}
};
/***/ },
/* 15 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = deprecated;
var _warning = __webpack_require__(6);
var _warning2 = _interopRequireDefault(_warning);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function deprecated(propType, explanation) {
return function validate(props, propName, componentName) {
if (props[propName] != null) {
true ? (0, _warning2.default)(false, '"' + propName + '" property of "' + componentName + '" has been deprecated.\n' + explanation) : void 0;
}
return propType(props, propName, componentName);
};
}
/***/ },
/* 16 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
exports.__esModule = true;
var _shallowEqual = __webpack_require__(217);
var _shallowEqual2 = _interopRequireDefault(_shallowEqual);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _shallowEqual2.default;
/***/ },
/* 17 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.dateTimeFormat = dateTimeFormat;
exports.addDays = addDays;
exports.addMonths = addMonths;
exports.addYears = addYears;
exports.cloneDate = cloneDate;
exports.cloneAsDate = cloneAsDate;
exports.getDaysInMonth = getDaysInMonth;
exports.getFirstDayOfMonth = getFirstDayOfMonth;
exports.getFirstDayOfWeek = getFirstDayOfWeek;
exports.getWeekArray = getWeekArray;
exports.localizedWeekday = localizedWeekday;
exports.formatIso = formatIso;
exports.isEqualDate = isEqualDate;
exports.isBeforeDate = isBeforeDate;
exports.isAfterDate = isAfterDate;
exports.isBetweenDates = isBetweenDates;
exports.monthDiff = monthDiff;
exports.yearDiff = yearDiff;
var _warning = __webpack_require__(6);
var _warning2 = _interopRequireDefault(_warning);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var dayAbbreviation = ['S', 'M', 'T', 'W', 'T', 'F', 'S'];
var dayList = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
var monthList = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
var monthLongList = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
function dateTimeFormat(locale, options) {
true ? (0, _warning2.default)(locale === 'en-US', 'The ' + locale + ' locale is not supported by the built-in DateTimeFormat.\n Use the `DateTimeFormat` prop to supply an alternative implementation.') : void 0;
this.format = function (date) {
if (options.month === 'short' && options.weekday === 'short' && options.day === '2-digit') {
return dayList[date.getDay()] + ', ' + monthList[date.getMonth()] + ' ' + date.getDate();
} else if (options.day === 'numeric' && options.month === 'numeric' && options.year === 'numeric') {
return date.getMonth() + 1 + '/' + date.getDate() + '/' + date.getFullYear();
} else if (options.month === 'long' && options.year === 'numeric') {
return monthLongList[date.getMonth()] + ' ' + date.getFullYear();
} else if (options.weekday === 'narrow') {
return dayAbbreviation[date.getDay()];
} else {
true ? (0, _warning2.default)(false, 'Wrong usage of DateTimeFormat') : void 0;
}
};
}
function addDays(d, days) {
var newDate = cloneDate(d);
newDate.setDate(d.getDate() + days);
return newDate;
}
function addMonths(d, months) {
var newDate = cloneDate(d);
newDate.setMonth(d.getMonth() + months);
return newDate;
}
function addYears(d, years) {
var newDate = cloneDate(d);
newDate.setFullYear(d.getFullYear() + years);
return newDate;
}
function cloneDate(d) {
return new Date(d.getTime());
}
function cloneAsDate(d) {
var clonedDate = cloneDate(d);
clonedDate.setHours(0, 0, 0, 0);
return clonedDate;
}
function getDaysInMonth(d) {
var resultDate = getFirstDayOfMonth(d);
resultDate.setMonth(resultDate.getMonth() + 1);
resultDate.setDate(resultDate.getDate() - 1);
return resultDate.getDate();
}
function getFirstDayOfMonth(d) {
return new Date(d.getFullYear(), d.getMonth(), 1);
}
function getFirstDayOfWeek() {
var now = new Date();
return new Date(now.setDate(now.getDate() - now.getDay()));
}
function getWeekArray(d, firstDayOfWeek) {
var dayArray = [];
var daysInMonth = getDaysInMonth(d);
var weekArray = [];
var week = [];
for (var i = 1; i <= daysInMonth; i++) {
dayArray.push(new Date(d.getFullYear(), d.getMonth(), i));
}
var addWeek = function addWeek(week) {
var emptyDays = 7 - week.length;
for (var _i = 0; _i < emptyDays; ++_i) {
week[weekArray.length ? 'push' : 'unshift'](null);
}
weekArray.push(week);
};
dayArray.forEach(function (day) {
if (week.length > 0 && day.getDay() === firstDayOfWeek) {
addWeek(week);
week = [];
}
week.push(day);
if (dayArray.indexOf(day) === dayArray.length - 1) {
addWeek(week);
}
});
return weekArray;
}
function localizedWeekday(DateTimeFormat, locale, day, firstDayOfWeek) {
var weekdayFormatter = new DateTimeFormat(locale, { weekday: 'narrow' });
var firstDayDate = getFirstDayOfWeek();
return weekdayFormatter.format(addDays(firstDayDate, day + firstDayOfWeek));
}
// Convert date to ISO 8601 (YYYY-MM-DD) date string, accounting for current timezone
function formatIso(date) {
return new Date(date.toDateString() + ' 12:00:00 +0000').toISOString().substring(0, 10);
}
function isEqualDate(d1, d2) {
return d1 && d2 && d1.getFullYear() === d2.getFullYear() && d1.getMonth() === d2.getMonth() && d1.getDate() === d2.getDate();
}
function isBeforeDate(d1, d2) {
var date1 = cloneAsDate(d1);
var date2 = cloneAsDate(d2);
return date1.getTime() < date2.getTime();
}
function isAfterDate(d1, d2) {
var date1 = cloneAsDate(d1);
var date2 = cloneAsDate(d2);
return date1.getTime() > date2.getTime();
}
function isBetweenDates(dateToCheck, startDate, endDate) {
return !isBeforeDate(dateToCheck, startDate) && !isAfterDate(dateToCheck, endDate);
}
function monthDiff(d1, d2) {
var m = void 0;
m = (d1.getFullYear() - d2.getFullYear()) * 12;
m += d1.getMonth();
m -= d2.getMonth();
return m;
}
function yearDiff(d1, d2) {
return ~~(monthDiff(d1, d2) / 12);
}
/***/ },
/* 18 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactDom = __webpack_require__(4);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _reactEventListener = __webpack_require__(13);
var _reactEventListener2 = _interopRequireDefault(_reactEventListener);
var _RenderToLayer = __webpack_require__(81);
var _RenderToLayer2 = _interopRequireDefault(_RenderToLayer);
var _propTypes = __webpack_require__(9);
var _propTypes2 = _interopRequireDefault(_propTypes);
var _Paper = __webpack_require__(8);
var _Paper2 = _interopRequireDefault(_Paper);
var _lodash = __webpack_require__(248);
var _lodash2 = _interopRequireDefault(_lodash);
var _PopoverAnimationDefault = __webpack_require__(141);
var _PopoverAnimationDefault2 = _interopRequireDefault(_PopoverAnimationDefault);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var Popover = function (_Component) {
_inherits(Popover, _Component);
function Popover(props, context) {
_classCallCheck(this, Popover);
var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(Popover).call(this, props, context));
_this.renderLayer = function () {
var _this$props = _this.props;
var animated = _this$props.animated;
var // eslint-disable-line no-unused-vars
animation = _this$props.animation;
var children = _this$props.children;
var style = _this$props.style;
var other = _objectWithoutProperties(_this$props, ['animated', 'animation', 'children', 'style']);
var Animation = animation || _PopoverAnimationDefault2.default;
var styleRoot = style;
if (!Animation) {
Animation = _Paper2.default;
styleRoot = {
position: 'fixed'
};
if (!_this.state.open) {
return null;
}
}
return _react2.default.createElement(
Animation,
_extends({}, other, { style: styleRoot, open: _this.state.open && !_this.state.closing }),
children
);
};
_this.componentClickAway = function () {
_this.requestClose('clickAway');
};
_this.setPlacement = function (scrolling) {
if (!_this.state.open) {
return;
}
var anchorEl = _this.props.anchorEl || _this.anchorEl;
if (!_this.refs.layer.getLayer()) {
return;
}
var targetEl = _this.refs.layer.getLayer().children[0];
if (!targetEl) {
return;
}
var _this$props2 = _this.props;
var targetOrigin = _this$props2.targetOrigin;
var anchorOrigin = _this$props2.anchorOrigin;
var anchor = _this.getAnchorPosition(anchorEl);
var target = _this.getTargetPosition(targetEl);
var targetPosition = {
top: anchor[anchorOrigin.vertical] - target[targetOrigin.vertical],
left: anchor[anchorOrigin.horizontal] - target[targetOrigin.horizontal]
};
if (scrolling && _this.props.autoCloseWhenOffScreen) {
_this.autoCloseWhenOffScreen(anchor);
}
if (_this.props.canAutoPosition) {
target = _this.getTargetPosition(targetEl); // update as height may have changed
targetPosition = _this.applyAutoPositionIfNeeded(anchor, target, targetOrigin, anchorOrigin, targetPosition);
}
targetEl.style.top = Math.max(0, targetPosition.top) + 'px';
targetEl.style.left = Math.max(0, targetPosition.left) + 'px';
targetEl.style.maxHeight = window.innerHeight + 'px';
};
_this.handleResize = (0, _lodash2.default)(_this.setPlacement, 100);
_this.handleScroll = (0, _lodash2.default)(_this.setPlacement.bind(_this, true), 50);
_this.state = {
open: props.open,
closing: false
};
return _this;
}
_createClass(Popover, [{
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
var _this2 = this;
if (nextProps.open !== this.state.open) {
if (nextProps.open) {
this.anchorEl = nextProps.anchorEl || this.props.anchorEl;
this.setState({
open: true,
closing: false
});
} else {
if (nextProps.animated) {
this.setState({ closing: true });
this.timeout = setTimeout(function () {
_this2.setState({
open: false
});
}, 500);
} else {
this.setState({
open: false
});
}
}
}
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
this.setPlacement();
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
clearTimeout(this.timeout);
}
}, {
key: 'requestClose',
value: function requestClose(reason) {
if (this.props.onRequestClose) {
this.props.onRequestClose(reason);
}
}
}, {
key: '_resizeAutoPosition',
value: function _resizeAutoPosition() {
this.setPlacement();
}
}, {
key: 'getAnchorPosition',
value: function getAnchorPosition(el) {
if (!el) {
el = _reactDom2.default.findDOMNode(this);
}
var rect = el.getBoundingClientRect();
var a = {
top: rect.top,
left: rect.left,
width: el.offsetWidth,
height: el.offsetHeight
};
a.right = rect.right || a.left + a.width;
a.bottom = rect.bottom || a.top + a.height;
a.middle = a.left + (a.right - a.left) / 2;
a.center = a.top + (a.bottom - a.top) / 2;
return a;
}
}, {
key: 'getTargetPosition',
value: function getTargetPosition(targetEl) {
return {
top: 0,
center: targetEl.offsetHeight / 2,
bottom: targetEl.offsetHeight,
left: 0,
middle: targetEl.offsetWidth / 2,
right: targetEl.offsetWidth
};
}
}, {
key: 'autoCloseWhenOffScreen',
value: function autoCloseWhenOffScreen(anchorPosition) {
if (anchorPosition.top < 0 || anchorPosition.top > window.innerHeight || anchorPosition.left < 0 || anchorPosition.left > window.innerWidth) {
this.requestClose('offScreen');
}
}
}, {
key: 'getOverlapMode',
value: function getOverlapMode(anchor, target, median) {
if ([anchor, target].indexOf(median) >= 0) return 'auto';
if (anchor === target) return 'inclusive';
return 'exclusive';
}
}, {
key: 'getPositions',
value: function getPositions(anchor, target) {
var a = _extends({}, anchor);
var t = _extends({}, target);
var positions = {
x: ['left', 'right'].filter(function (p) {
return p !== t.horizontal;
}),
y: ['top', 'bottom'].filter(function (p) {
return p !== t.vertical;
})
};
var overlap = {
x: this.getOverlapMode(a.horizontal, t.horizontal, 'middle'),
y: this.getOverlapMode(a.vertical, t.vertical, 'center')
};
positions.x.splice(overlap.x === 'auto' ? 0 : 1, 0, 'middle');
positions.y.splice(overlap.y === 'auto' ? 0 : 1, 0, 'center');
if (overlap.y !== 'auto') {
a.vertical = a.vertical === 'top' ? 'bottom' : 'top';
if (overlap.y === 'inclusive') {
t.vertical = t.vertical;
}
}
if (overlap.x !== 'auto') {
a.horizontal = a.horizontal === 'left' ? 'right' : 'left';
if (overlap.y === 'inclusive') {
t.horizontal = t.horizontal;
}
}
return {
positions: positions,
anchorPos: a
};
}
}, {
key: 'applyAutoPositionIfNeeded',
value: function applyAutoPositionIfNeeded(anchor, target, targetOrigin, anchorOrigin, targetPosition) {
var _getPositions = this.getPositions(anchorOrigin, targetOrigin);
var positions = _getPositions.positions;
var anchorPos = _getPositions.anchorPos;
if (targetPosition.top < 0 || targetPosition.top + target.bottom > window.innerHeight) {
var newTop = anchor[anchorPos.vertical] - target[positions.y[0]];
if (newTop + target.bottom <= window.innerHeight) targetPosition.top = Math.max(0, newTop);else {
newTop = anchor[anchorPos.vertical] - target[positions.y[1]];
if (newTop + target.bottom <= window.innerHeight) targetPosition.top = Math.max(0, newTop);
}
}
if (targetPosition.left < 0 || targetPosition.left + target.right > window.innerWidth) {
var newLeft = anchor[anchorPos.horizontal] - target[positions.x[0]];
if (newLeft + target.right <= window.innerWidth) targetPosition.left = Math.max(0, newLeft);else {
newLeft = anchor[anchorPos.horizontal] - target[positions.x[1]];
if (newLeft + target.right <= window.innerWidth) targetPosition.left = Math.max(0, newLeft);
}
}
return targetPosition;
}
}, {
key: 'render',
value: function render() {
return _react2.default.createElement(
'div',
{ style: { display: 'none' } },
_react2.default.createElement(_reactEventListener2.default, {
target: 'window',
onScroll: this.handleScroll,
onResize: this.handleResize
}),
_react2.default.createElement(_RenderToLayer2.default, {
ref: 'layer',
open: this.state.open,
componentClickAway: this.componentClickAway,
useLayerForClickAway: this.props.useLayerForClickAway,
render: this.renderLayer
})
);
}
}]);
return Popover;
}(_react.Component);
Popover.propTypes = {
/**
* This is the DOM element that will be used to set the position of the
* popover.
*/
anchorEl: _react.PropTypes.object,
/**
* This is the point on the anchor where the popover's
* `targetOrigin` will attach to.
* Options:
* vertical: [top, middle, bottom];
* horizontal: [left, center, right].
*/
anchorOrigin: _propTypes2.default.origin,
/**
* If true, the popover will apply transitions when
* it is added to the DOM.
*/
animated: _react.PropTypes.bool,
/**
* Override the default animation component used.
*/
animation: _react.PropTypes.func,
/**
* If true, the popover will hide when the anchor is scrolled off the screen.
*/
autoCloseWhenOffScreen: _react.PropTypes.bool,
/**
* If true, the popover (potentially) ignores `targetOrigin`
* and `anchorOrigin` to make itself fit on screen,
* which is useful for mobile devices.
*/
canAutoPosition: _react.PropTypes.bool,
/**
* The content of the popover.
*/
children: _react.PropTypes.node,
/**
* The CSS class name of the root element.
*/
className: _react.PropTypes.string,
/**
* Callback function fired when the popover is requested to be closed.
*
* @param {string} reason The reason for the close request. Possibles values
* are 'clickAway' and 'offScreen'.
*/
onRequestClose: _react.PropTypes.func,
/**
* If true, the popover is visible.
*/
open: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* This is the point on the popover which will attach to
* the anchor's origin.
* Options:
* vertical: [top, middle, bottom];
* horizontal: [left, center, right].
*/
targetOrigin: _propTypes2.default.origin,
/**
* If true, the popover will render on top of an invisible
* layer, which will prevent clicks to the underlying
* elements, and trigger an `onRequestClose('clickAway')` call.
*/
useLayerForClickAway: _react.PropTypes.bool,
/**
* The zDepth of the popover.
*/
zDepth: _propTypes2.default.zDepth
};
Popover.defaultProps = {
anchorOrigin: {
vertical: 'bottom',
horizontal: 'left'
},
animated: true,
autoCloseWhenOffScreen: true,
canAutoPosition: true,
onRequestClose: function onRequestClose() {},
open: false,
style: {
overflowY: 'auto'
},
targetOrigin: {
vertical: 'top',
horizontal: 'left'
},
useLayerForClickAway: true,
zDepth: 1
};
Popover.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = Popover;
/***/ },
/* 19 */
/***/ function(module, exports, __webpack_require__) {
/**
* Copyright (c) 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
*/
'use strict';
/**
* Use invariant() to assert state which your program assumes to be true.
*
* Provide sprintf-style format (only %s is supported) and arguments
* to provide information about what broke and what you were
* expecting.
*
* The invariant message will be stripped in production, but the invariant
* will remain to ensure logic does not differ in production.
*/
function invariant(condition, format, a, b, c, d, e, f) {
if (true) {
if (format === undefined) {
throw new Error('invariant requires an error message argument');
}
}
if (!condition) {
var error;
if (format === undefined) {
error = new Error('Minified exception occurred; use the non-minified dev environment ' + 'for the full error message and additional helpful warnings.');
} else {
var args = [a, b, c, d, e, f];
var argIndex = 0;
error = new Error(format.replace(/%s/g, function () {
return args[argIndex++];
}));
error.name = 'Invariant Violation';
}
error.framesToPop = 1; // we don't care about invariant's own frame
throw error;
}
}
module.exports = invariant;
/***/ },
/* 20 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _IconButton = __webpack_require__(133);
var _IconButton2 = _interopRequireDefault(_IconButton);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _IconButton2.default;
/***/ },
/* 21 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _TextField = __webpack_require__(169);
var _TextField2 = _interopRequireDefault(_TextField);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _TextField2.default;
/***/ },
/* 22 */
/***/ function(module, exports) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.addHours = addHours;
exports.addMinutes = addMinutes;
exports.addSeconds = addSeconds;
exports.formatTime = formatTime;
exports.rad2deg = rad2deg;
exports.getTouchEventOffsetValues = getTouchEventOffsetValues;
exports.isInner = isInner;
function addHours(d, hours) {
var newDate = clone(d);
newDate.setHours(d.getHours() + hours);
return newDate;
}
function addMinutes(d, minutes) {
var newDate = clone(d);
newDate.setMinutes(d.getMinutes() + minutes);
return newDate;
}
function addSeconds(d, seconds) {
var newDate = clone(d);
newDate.setSeconds(d.getMinutes() + seconds);
return newDate;
}
function clone(d) {
return new Date(d.getTime());
}
/**
* @param date [Date] A Date object.
* @param format [String] One of 'ampm', '24hr', defaults to 'ampm'.
* @param pedantic [Boolean] Check time-picker/time-picker.jsx file.
*
* @return String A string representing the formatted time.
*/
function formatTime(date) {
var format = arguments.length <= 1 || arguments[1] === undefined ? 'ampm' : arguments[1];
var pedantic = arguments.length <= 2 || arguments[2] === undefined ? false : arguments[2];
if (!date) return '';
var hours = date.getHours();
var mins = date.getMinutes().toString();
if (format === 'ampm') {
var isAM = hours < 12;
hours = hours % 12;
var additional = isAM ? ' am' : ' pm';
hours = (hours || 12).toString();
if (mins.length < 2) mins = '0' + mins;
if (pedantic) {
// Treat midday/midnight specially http://www.nist.gov/pml/div688/times.cfm
if (hours === '12' && mins === '00') {
return additional === ' pm' ? '12 noon' : '12 midnight';
}
}
return hours + (mins === '00' ? '' : ':' + mins) + additional;
}
hours = hours.toString();
if (hours.length < 2) hours = '0' + hours;
if (mins.length < 2) mins = '0' + mins;
return hours + ':' + mins;
}
function rad2deg(rad) {
return rad * 57.29577951308232;
}
function getTouchEventOffsetValues(event) {
var el = event.target;
var boundingRect = el.getBoundingClientRect();
return {
offsetX: event.clientX - boundingRect.left,
offsetY: event.clientY - boundingRect.top
};
}
function isInner(props) {
if (props.type !== 'hour') {
return false;
}
return props.value < 1 || props.value > 12;
}
/***/ },
/* 23 */
/***/ function(module, exports) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var red50 = exports.red50 = '#ffebee';
var red100 = exports.red100 = '#ffcdd2';
var red200 = exports.red200 = '#ef9a9a';
var red300 = exports.red300 = '#e57373';
var red400 = exports.red400 = '#ef5350';
var red500 = exports.red500 = '#f44336';
var red600 = exports.red600 = '#e53935';
var red700 = exports.red700 = '#d32f2f';
var red800 = exports.red800 = '#c62828';
var red900 = exports.red900 = '#b71c1c';
var redA100 = exports.redA100 = '#ff8a80';
var redA200 = exports.redA200 = '#ff5252';
var redA400 = exports.redA400 = '#ff1744';
var redA700 = exports.redA700 = '#d50000';
var pink50 = exports.pink50 = '#fce4ec';
var pink100 = exports.pink100 = '#f8bbd0';
var pink200 = exports.pink200 = '#f48fb1';
var pink300 = exports.pink300 = '#f06292';
var pink400 = exports.pink400 = '#ec407a';
var pink500 = exports.pink500 = '#e91e63';
var pink600 = exports.pink600 = '#d81b60';
var pink700 = exports.pink700 = '#c2185b';
var pink800 = exports.pink800 = '#ad1457';
var pink900 = exports.pink900 = '#880e4f';
var pinkA100 = exports.pinkA100 = '#ff80ab';
var pinkA200 = exports.pinkA200 = '#ff4081';
var pinkA400 = exports.pinkA400 = '#f50057';
var pinkA700 = exports.pinkA700 = '#c51162';
var purple50 = exports.purple50 = '#f3e5f5';
var purple100 = exports.purple100 = '#e1bee7';
var purple200 = exports.purple200 = '#ce93d8';
var purple300 = exports.purple300 = '#ba68c8';
var purple400 = exports.purple400 = '#ab47bc';
var purple500 = exports.purple500 = '#9c27b0';
var purple600 = exports.purple600 = '#8e24aa';
var purple700 = exports.purple700 = '#7b1fa2';
var purple800 = exports.purple800 = '#6a1b9a';
var purple900 = exports.purple900 = '#4a148c';
var purpleA100 = exports.purpleA100 = '#ea80fc';
var purpleA200 = exports.purpleA200 = '#e040fb';
var purpleA400 = exports.purpleA400 = '#d500f9';
var purpleA700 = exports.purpleA700 = '#aa00ff';
var deepPurple50 = exports.deepPurple50 = '#ede7f6';
var deepPurple100 = exports.deepPurple100 = '#d1c4e9';
var deepPurple200 = exports.deepPurple200 = '#b39ddb';
var deepPurple300 = exports.deepPurple300 = '#9575cd';
var deepPurple400 = exports.deepPurple400 = '#7e57c2';
var deepPurple500 = exports.deepPurple500 = '#673ab7';
var deepPurple600 = exports.deepPurple600 = '#5e35b1';
var deepPurple700 = exports.deepPurple700 = '#512da8';
var deepPurple800 = exports.deepPurple800 = '#4527a0';
var deepPurple900 = exports.deepPurple900 = '#311b92';
var deepPurpleA100 = exports.deepPurpleA100 = '#b388ff';
var deepPurpleA200 = exports.deepPurpleA200 = '#7c4dff';
var deepPurpleA400 = exports.deepPurpleA400 = '#651fff';
var deepPurpleA700 = exports.deepPurpleA700 = '#6200ea';
var indigo50 = exports.indigo50 = '#e8eaf6';
var indigo100 = exports.indigo100 = '#c5cae9';
var indigo200 = exports.indigo200 = '#9fa8da';
var indigo300 = exports.indigo300 = '#7986cb';
var indigo400 = exports.indigo400 = '#5c6bc0';
var indigo500 = exports.indigo500 = '#3f51b5';
var indigo600 = exports.indigo600 = '#3949ab';
var indigo700 = exports.indigo700 = '#303f9f';
var indigo800 = exports.indigo800 = '#283593';
var indigo900 = exports.indigo900 = '#1a237e';
var indigoA100 = exports.indigoA100 = '#8c9eff';
var indigoA200 = exports.indigoA200 = '#536dfe';
var indigoA400 = exports.indigoA400 = '#3d5afe';
var indigoA700 = exports.indigoA700 = '#304ffe';
var blue50 = exports.blue50 = '#e3f2fd';
var blue100 = exports.blue100 = '#bbdefb';
var blue200 = exports.blue200 = '#90caf9';
var blue300 = exports.blue300 = '#64b5f6';
var blue400 = exports.blue400 = '#42a5f5';
var blue500 = exports.blue500 = '#2196f3';
var blue600 = exports.blue600 = '#1e88e5';
var blue700 = exports.blue700 = '#1976d2';
var blue800 = exports.blue800 = '#1565c0';
var blue900 = exports.blue900 = '#0d47a1';
var blueA100 = exports.blueA100 = '#82b1ff';
var blueA200 = exports.blueA200 = '#448aff';
var blueA400 = exports.blueA400 = '#2979ff';
var blueA700 = exports.blueA700 = '#2962ff';
var lightBlue50 = exports.lightBlue50 = '#e1f5fe';
var lightBlue100 = exports.lightBlue100 = '#b3e5fc';
var lightBlue200 = exports.lightBlue200 = '#81d4fa';
var lightBlue300 = exports.lightBlue300 = '#4fc3f7';
var lightBlue400 = exports.lightBlue400 = '#29b6f6';
var lightBlue500 = exports.lightBlue500 = '#03a9f4';
var lightBlue600 = exports.lightBlue600 = '#039be5';
var lightBlue700 = exports.lightBlue700 = '#0288d1';
var lightBlue800 = exports.lightBlue800 = '#0277bd';
var lightBlue900 = exports.lightBlue900 = '#01579b';
var lightBlueA100 = exports.lightBlueA100 = '#80d8ff';
var lightBlueA200 = exports.lightBlueA200 = '#40c4ff';
var lightBlueA400 = exports.lightBlueA400 = '#00b0ff';
var lightBlueA700 = exports.lightBlueA700 = '#0091ea';
var cyan50 = exports.cyan50 = '#e0f7fa';
var cyan100 = exports.cyan100 = '#b2ebf2';
var cyan200 = exports.cyan200 = '#80deea';
var cyan300 = exports.cyan300 = '#4dd0e1';
var cyan400 = exports.cyan400 = '#26c6da';
var cyan500 = exports.cyan500 = '#00bcd4';
var cyan600 = exports.cyan600 = '#00acc1';
var cyan700 = exports.cyan700 = '#0097a7';
var cyan800 = exports.cyan800 = '#00838f';
var cyan900 = exports.cyan900 = '#006064';
var cyanA100 = exports.cyanA100 = '#84ffff';
var cyanA200 = exports.cyanA200 = '#18ffff';
var cyanA400 = exports.cyanA400 = '#00e5ff';
var cyanA700 = exports.cyanA700 = '#00b8d4';
var teal50 = exports.teal50 = '#e0f2f1';
var teal100 = exports.teal100 = '#b2dfdb';
var teal200 = exports.teal200 = '#80cbc4';
var teal300 = exports.teal300 = '#4db6ac';
var teal400 = exports.teal400 = '#26a69a';
var teal500 = exports.teal500 = '#009688';
var teal600 = exports.teal600 = '#00897b';
var teal700 = exports.teal700 = '#00796b';
var teal800 = exports.teal800 = '#00695c';
var teal900 = exports.teal900 = '#004d40';
var tealA100 = exports.tealA100 = '#a7ffeb';
var tealA200 = exports.tealA200 = '#64ffda';
var tealA400 = exports.tealA400 = '#1de9b6';
var tealA700 = exports.tealA700 = '#00bfa5';
var green50 = exports.green50 = '#e8f5e9';
var green100 = exports.green100 = '#c8e6c9';
var green200 = exports.green200 = '#a5d6a7';
var green300 = exports.green300 = '#81c784';
var green400 = exports.green400 = '#66bb6a';
var green500 = exports.green500 = '#4caf50';
var green600 = exports.green600 = '#43a047';
var green700 = exports.green700 = '#388e3c';
var green800 = exports.green800 = '#2e7d32';
var green900 = exports.green900 = '#1b5e20';
var greenA100 = exports.greenA100 = '#b9f6ca';
var greenA200 = exports.greenA200 = '#69f0ae';
var greenA400 = exports.greenA400 = '#00e676';
var greenA700 = exports.greenA700 = '#00c853';
var lightGreen50 = exports.lightGreen50 = '#f1f8e9';
var lightGreen100 = exports.lightGreen100 = '#dcedc8';
var lightGreen200 = exports.lightGreen200 = '#c5e1a5';
var lightGreen300 = exports.lightGreen300 = '#aed581';
var lightGreen400 = exports.lightGreen400 = '#9ccc65';
var lightGreen500 = exports.lightGreen500 = '#8bc34a';
var lightGreen600 = exports.lightGreen600 = '#7cb342';
var lightGreen700 = exports.lightGreen700 = '#689f38';
var lightGreen800 = exports.lightGreen800 = '#558b2f';
var lightGreen900 = exports.lightGreen900 = '#33691e';
var lightGreenA100 = exports.lightGreenA100 = '#ccff90';
var lightGreenA200 = exports.lightGreenA200 = '#b2ff59';
var lightGreenA400 = exports.lightGreenA400 = '#76ff03';
var lightGreenA700 = exports.lightGreenA700 = '#64dd17';
var lime50 = exports.lime50 = '#f9fbe7';
var lime100 = exports.lime100 = '#f0f4c3';
var lime200 = exports.lime200 = '#e6ee9c';
var lime300 = exports.lime300 = '#dce775';
var lime400 = exports.lime400 = '#d4e157';
var lime500 = exports.lime500 = '#cddc39';
var lime600 = exports.lime600 = '#c0ca33';
var lime700 = exports.lime700 = '#afb42b';
var lime800 = exports.lime800 = '#9e9d24';
var lime900 = exports.lime900 = '#827717';
var limeA100 = exports.limeA100 = '#f4ff81';
var limeA200 = exports.limeA200 = '#eeff41';
var limeA400 = exports.limeA400 = '#c6ff00';
var limeA700 = exports.limeA700 = '#aeea00';
var yellow50 = exports.yellow50 = '#fffde7';
var yellow100 = exports.yellow100 = '#fff9c4';
var yellow200 = exports.yellow200 = '#fff59d';
var yellow300 = exports.yellow300 = '#fff176';
var yellow400 = exports.yellow400 = '#ffee58';
var yellow500 = exports.yellow500 = '#ffeb3b';
var yellow600 = exports.yellow600 = '#fdd835';
var yellow700 = exports.yellow700 = '#fbc02d';
var yellow800 = exports.yellow800 = '#f9a825';
var yellow900 = exports.yellow900 = '#f57f17';
var yellowA100 = exports.yellowA100 = '#ffff8d';
var yellowA200 = exports.yellowA200 = '#ffff00';
var yellowA400 = exports.yellowA400 = '#ffea00';
var yellowA700 = exports.yellowA700 = '#ffd600';
var amber50 = exports.amber50 = '#fff8e1';
var amber100 = exports.amber100 = '#ffecb3';
var amber200 = exports.amber200 = '#ffe082';
var amber300 = exports.amber300 = '#ffd54f';
var amber400 = exports.amber400 = '#ffca28';
var amber500 = exports.amber500 = '#ffc107';
var amber600 = exports.amber600 = '#ffb300';
var amber700 = exports.amber700 = '#ffa000';
var amber800 = exports.amber800 = '#ff8f00';
var amber900 = exports.amber900 = '#ff6f00';
var amberA100 = exports.amberA100 = '#ffe57f';
var amberA200 = exports.amberA200 = '#ffd740';
var amberA400 = exports.amberA400 = '#ffc400';
var amberA700 = exports.amberA700 = '#ffab00';
var orange50 = exports.orange50 = '#fff3e0';
var orange100 = exports.orange100 = '#ffe0b2';
var orange200 = exports.orange200 = '#ffcc80';
var orange300 = exports.orange300 = '#ffb74d';
var orange400 = exports.orange400 = '#ffa726';
var orange500 = exports.orange500 = '#ff9800';
var orange600 = exports.orange600 = '#fb8c00';
var orange700 = exports.orange700 = '#f57c00';
var orange800 = exports.orange800 = '#ef6c00';
var orange900 = exports.orange900 = '#e65100';
var orangeA100 = exports.orangeA100 = '#ffd180';
var orangeA200 = exports.orangeA200 = '#ffab40';
var orangeA400 = exports.orangeA400 = '#ff9100';
var orangeA700 = exports.orangeA700 = '#ff6d00';
var deepOrange50 = exports.deepOrange50 = '#fbe9e7';
var deepOrange100 = exports.deepOrange100 = '#ffccbc';
var deepOrange200 = exports.deepOrange200 = '#ffab91';
var deepOrange300 = exports.deepOrange300 = '#ff8a65';
var deepOrange400 = exports.deepOrange400 = '#ff7043';
var deepOrange500 = exports.deepOrange500 = '#ff5722';
var deepOrange600 = exports.deepOrange600 = '#f4511e';
var deepOrange700 = exports.deepOrange700 = '#e64a19';
var deepOrange800 = exports.deepOrange800 = '#d84315';
var deepOrange900 = exports.deepOrange900 = '#bf360c';
var deepOrangeA100 = exports.deepOrangeA100 = '#ff9e80';
var deepOrangeA200 = exports.deepOrangeA200 = '#ff6e40';
var deepOrangeA400 = exports.deepOrangeA400 = '#ff3d00';
var deepOrangeA700 = exports.deepOrangeA700 = '#dd2c00';
var brown50 = exports.brown50 = '#efebe9';
var brown100 = exports.brown100 = '#d7ccc8';
var brown200 = exports.brown200 = '#bcaaa4';
var brown300 = exports.brown300 = '#a1887f';
var brown400 = exports.brown400 = '#8d6e63';
var brown500 = exports.brown500 = '#795548';
var brown600 = exports.brown600 = '#6d4c41';
var brown700 = exports.brown700 = '#5d4037';
var brown800 = exports.brown800 = '#4e342e';
var brown900 = exports.brown900 = '#3e2723';
var blueGrey50 = exports.blueGrey50 = '#eceff1';
var blueGrey100 = exports.blueGrey100 = '#cfd8dc';
var blueGrey200 = exports.blueGrey200 = '#b0bec5';
var blueGrey300 = exports.blueGrey300 = '#90a4ae';
var blueGrey400 = exports.blueGrey400 = '#78909c';
var blueGrey500 = exports.blueGrey500 = '#607d8b';
var blueGrey600 = exports.blueGrey600 = '#546e7a';
var blueGrey700 = exports.blueGrey700 = '#455a64';
var blueGrey800 = exports.blueGrey800 = '#37474f';
var blueGrey900 = exports.blueGrey900 = '#263238';
var grey50 = exports.grey50 = '#fafafa';
var grey100 = exports.grey100 = '#f5f5f5';
var grey200 = exports.grey200 = '#eeeeee';
var grey300 = exports.grey300 = '#e0e0e0';
var grey400 = exports.grey400 = '#bdbdbd';
var grey500 = exports.grey500 = '#9e9e9e';
var grey600 = exports.grey600 = '#757575';
var grey700 = exports.grey700 = '#616161';
var grey800 = exports.grey800 = '#424242';
var grey900 = exports.grey900 = '#212121';
var black = exports.black = '#000000';
var white = exports.white = '#ffffff';
var transparent = exports.transparent = 'rgba(0, 0, 0, 0)';
var fullBlack = exports.fullBlack = 'rgba(0, 0, 0, 1)';
var darkBlack = exports.darkBlack = 'rgba(0, 0, 0, 0.87)';
var lightBlack = exports.lightBlack = 'rgba(0, 0, 0, 0.54)';
var minBlack = exports.minBlack = 'rgba(0, 0, 0, 0.26)';
var faintBlack = exports.faintBlack = 'rgba(0, 0, 0, 0.12)';
var fullWhite = exports.fullWhite = 'rgba(255, 255, 255, 1)';
var darkWhite = exports.darkWhite = 'rgba(255, 255, 255, 0.87)';
var lightWhite = exports.lightWhite = 'rgba(255, 255, 255, 0.54)';
/***/ },
/* 24 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.createChildFragment = createChildFragment;
exports.extendChildren = extendChildren;
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactAddonsCreateFragment = __webpack_require__(272);
var _reactAddonsCreateFragment2 = _interopRequireDefault(_reactAddonsCreateFragment);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function createChildFragment(fragments) {
var newFragments = {};
var validChildrenCount = 0;
var firstKey = void 0;
// Only create non-empty key fragments
for (var key in fragments) {
var currentChild = fragments[key];
if (currentChild) {
if (validChildrenCount === 0) firstKey = key;
newFragments[key] = currentChild;
validChildrenCount++;
}
}
if (validChildrenCount === 0) return undefined;
if (validChildrenCount === 1) return newFragments[firstKey];
return (0, _reactAddonsCreateFragment2.default)(newFragments);
}
function extendChildren(children, extendedProps, extendedChildren) {
return _react2.default.isValidElement(children) ? _react2.default.Children.map(children, function (child) {
var newProps = typeof extendedProps === 'function' ? extendedProps(child) : extendedProps;
var newChildren = typeof extendedChildren === 'function' ? extendedChildren(child) : extendedChildren ? extendedChildren : child.props.children;
return _react2.default.cloneElement(child, newProps, newChildren);
}) : children;
}
/***/ },
/* 25 */
/***/ function(module, exports) {
/**
* Copyright (c) 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule reactProdInvariant
*/
'use strict';
/**
* WARNING: DO NOT manually require this module.
* This is a replacement for `invariant(...)` used by the error code system
* and will _only_ be required by the corresponding babel pass.
* It always throws.
*/
function reactProdInvariant(code) {
var argCount = arguments.length - 1;
var message = 'Minified React error #' + code + '; visit ' + 'http://facebook.github.io/react/docs/error-decoder.html?invariant=' + code;
for (var argIdx = 0; argIdx < argCount; argIdx++) {
message += '&args[]=' + encodeURIComponent(arguments[argIdx + 1]);
}
message += ' for the full message or use the non-minified dev environment' + ' for full errors and additional helpful warnings.';
var error = new Error(message);
error.name = 'Invariant Violation';
error.framesToPop = 1; // we don't care about reactProdInvariant's own frame
throw error;
}
module.exports = reactProdInvariant;
/***/ },
/* 26 */
/***/ function(module, exports) {
module.exports = __WEBPACK_EXTERNAL_MODULE_26__;
/***/ },
/* 27 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _FlatButton = __webpack_require__(126);
var _FlatButton2 = _interopRequireDefault(_FlatButton);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _FlatButton2.default;
/***/ },
/* 28 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactDom = __webpack_require__(4);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _shallowEqual = __webpack_require__(16);
var _shallowEqual2 = _interopRequireDefault(_shallowEqual);
var _ClickAwayListener = __webpack_require__(41);
var _ClickAwayListener2 = _interopRequireDefault(_ClickAwayListener);
var _autoPrefix = __webpack_require__(14);
var _autoPrefix2 = _interopRequireDefault(_autoPrefix);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _keycode = __webpack_require__(10);
var _keycode2 = _interopRequireDefault(_keycode);
var _propTypes = __webpack_require__(9);
var _propTypes2 = _interopRequireDefault(_propTypes);
var _List = __webpack_require__(35);
var _List2 = _interopRequireDefault(_List);
var _deprecatedPropType = __webpack_require__(15);
var _deprecatedPropType2 = _interopRequireDefault(_deprecatedPropType);
var _warning = __webpack_require__(6);
var _warning2 = _interopRequireDefault(_warning);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _toArray(arr) { return Array.isArray(arr) ? arr : Array.from(arr); }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var animated = props.animated;
var desktop = props.desktop;
var maxHeight = props.maxHeight;
var _props$openDirection = props.openDirection;
var openDirection = _props$openDirection === undefined ? 'bottom-left' : _props$openDirection;
var width = props.width;
var openDown = openDirection.split('-')[0] === 'bottom';
var openLeft = openDirection.split('-')[1] === 'left';
var muiTheme = context.muiTheme;
var styles = {
root: {
// Nested div bacause the List scales x faster than it scales y
transition: animated ? _transitions2.default.easeOut('250ms', 'transform') : null,
zIndex: muiTheme.zIndex.menu,
top: openDown ? 0 : null,
bottom: !openDown ? 0 : null,
left: !openLeft ? 0 : null,
right: openLeft ? 0 : null,
transform: animated ? 'scaleX(0)' : null,
transformOrigin: openLeft ? 'right' : 'left',
opacity: 0,
maxHeight: maxHeight,
overflowY: maxHeight ? 'auto' : null
},
divider: {
marginTop: 7,
marginBottom: 8
},
list: {
display: 'table-cell',
paddingBottom: desktop ? 16 : 8,
paddingTop: desktop ? 16 : 8,
userSelect: 'none',
width: width
},
menuItemContainer: {
transition: animated ? _transitions2.default.easeOut(null, 'opacity') : null,
opacity: 0
},
selectedMenuItem: {
color: muiTheme.baseTheme.palette.accent1Color
}
};
return styles;
}
var Menu = function (_Component) {
_inherits(Menu, _Component);
function Menu(props, context) {
_classCallCheck(this, Menu);
var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(Menu).call(this, props, context));
_initialiseProps.call(_this);
var filteredChildren = _this.getFilteredChildren(props.children);
var selectedIndex = _this.getSelectedIndex(props, filteredChildren);
_this.state = {
focusIndex: props.disableAutoFocus ? -1 : selectedIndex >= 0 ? selectedIndex : 0,
isKeyboardFocused: props.initiallyKeyboardFocused,
keyWidth: props.desktop ? 64 : 56
};
return _this;
}
_createClass(Menu, [{
key: 'componentDidMount',
value: function componentDidMount() {
if (this.props.autoWidth) this.setWidth();
if (!this.props.animated) this.animateOpen();
this.setScollPosition();
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
var filteredChildren = this.getFilteredChildren(nextProps.children);
var selectedIndex = this.getSelectedIndex(nextProps, filteredChildren);
this.setState({
focusIndex: nextProps.disableAutoFocus ? -1 : selectedIndex >= 0 ? selectedIndex : 0,
keyWidth: nextProps.desktop ? 64 : 56
});
}
}, {
key: 'shouldComponentUpdate',
value: function shouldComponentUpdate(nextProps, nextState) {
return !(0, _shallowEqual2.default)(this.props, nextProps) || !(0, _shallowEqual2.default)(this.state, nextState);
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
if (this.props.autoWidth) this.setWidth();
}
}, {
key: 'getValueLink',
// Do not use outside of this component, it will be removed once valueLink is deprecated
value: function getValueLink(props) {
return props.valueLink || {
value: props.value,
requestChange: props.onChange
};
}
}, {
key: 'setKeyboardFocused',
value: function setKeyboardFocused(keyboardFocused) {
this.setState({
isKeyboardFocused: keyboardFocused
});
}
}, {
key: 'getFilteredChildren',
value: function getFilteredChildren(children) {
var filteredChildren = [];
_react2.default.Children.forEach(children, function (child) {
if (child) {
filteredChildren.push(child);
}
});
return filteredChildren;
}
}, {
key: 'animateOpen',
value: function animateOpen() {
var rootStyle = _reactDom2.default.findDOMNode(this).style;
var scrollContainerStyle = _reactDom2.default.findDOMNode(this.refs.scrollContainer).style;
var menuContainers = _reactDom2.default.findDOMNode(this.refs.list).childNodes;
_autoPrefix2.default.set(rootStyle, 'transform', 'scaleX(1)');
_autoPrefix2.default.set(scrollContainerStyle, 'transform', 'scaleY(1)');
scrollContainerStyle.opacity = 1;
for (var i = 0; i < menuContainers.length; ++i) {
menuContainers[i].style.opacity = 1;
}
}
}, {
key: 'cloneMenuItem',
value: function cloneMenuItem(child, childIndex, styles, index) {
var _this2 = this;
var _props = this.props;
var desktop = _props.desktop;
var selectedMenuItemStyle = _props.selectedMenuItemStyle;
var selected = this.isChildSelected(child, this.props);
var selectedChildrenStyles = {};
if (selected) {
selectedChildrenStyles = (0, _simpleAssign2.default)(styles.selectedMenuItem, selectedMenuItemStyle);
}
var mergedChildrenStyles = (0, _simpleAssign2.default)({}, child.props.style, selectedChildrenStyles);
var isFocused = childIndex === this.state.focusIndex;
var focusState = 'none';
if (isFocused) {
focusState = this.state.isKeyboardFocused ? 'keyboard-focused' : 'focused';
}
return _react2.default.cloneElement(child, {
desktop: desktop,
focusState: focusState,
onTouchTap: function onTouchTap(event) {
_this2.handleMenuItemTouchTap(event, child, index);
if (child.props.onTouchTap) child.props.onTouchTap(event);
},
ref: isFocused ? 'focusedMenuItem' : null,
style: mergedChildrenStyles
});
}
}, {
key: 'decrementKeyboardFocusIndex',
value: function decrementKeyboardFocusIndex() {
var index = this.state.focusIndex;
index--;
if (index < 0) index = 0;
this.setFocusIndex(index, true);
}
}, {
key: 'getCascadeChildrenCount',
value: function getCascadeChildrenCount(filteredChildren) {
var _props2 = this.props;
var desktop = _props2.desktop;
var maxHeight = _props2.maxHeight;
var count = 1;
var currentHeight = desktop ? 16 : 8;
var menuItemHeight = desktop ? 32 : 48;
// MaxHeight isn't set - cascade all of the children
if (!maxHeight) return filteredChildren.length;
// Count all the children that will fit inside the max menu height
filteredChildren.forEach(function (child) {
if (currentHeight < maxHeight) {
var childIsADivider = child.type && child.type.muiName === 'Divider';
currentHeight += childIsADivider ? 16 : menuItemHeight;
count++;
}
});
return count;
}
}, {
key: 'getMenuItemCount',
value: function getMenuItemCount(filteredChildren) {
var menuItemCount = 0;
filteredChildren.forEach(function (child) {
var childIsADivider = child.type && child.type.muiName === 'Divider';
var childIsDisabled = child.props.disabled;
if (!childIsADivider && !childIsDisabled) menuItemCount++;
});
return menuItemCount;
}
}, {
key: 'getSelectedIndex',
value: function getSelectedIndex(props, filteredChildren) {
var _this3 = this;
var selectedIndex = -1;
var menuItemIndex = 0;
filteredChildren.forEach(function (child) {
var childIsADivider = child.type && child.type.muiName === 'Divider';
if (_this3.isChildSelected(child, props)) selectedIndex = menuItemIndex;
if (!childIsADivider) menuItemIndex++;
});
return selectedIndex;
}
}, {
key: 'handleMenuItemTouchTap',
value: function handleMenuItemTouchTap(event, item, index) {
var children = this.props.children;
var multiple = this.props.multiple;
var valueLink = this.getValueLink(this.props);
var menuValue = valueLink.value;
var itemValue = item.props.value;
var focusIndex = _react2.default.isValidElement(children) ? 0 : children.indexOf(item);
this.setFocusIndex(focusIndex, false);
if (multiple) {
var itemIndex = menuValue.indexOf(itemValue);
var _menuValue = _toArray(menuValue);
var newMenuValue = _menuValue;
if (itemIndex === -1) {
newMenuValue.push(itemValue);
} else {
newMenuValue.splice(itemIndex, 1);
}
valueLink.requestChange(event, newMenuValue);
} else if (!multiple && itemValue !== menuValue) {
valueLink.requestChange(event, itemValue);
}
this.props.onItemTouchTap(event, item, index);
}
}, {
key: 'incrementKeyboardFocusIndex',
value: function incrementKeyboardFocusIndex(filteredChildren) {
var index = this.state.focusIndex;
var maxIndex = this.getMenuItemCount(filteredChildren) - 1;
index++;
if (index > maxIndex) index = maxIndex;
this.setFocusIndex(index, true);
}
}, {
key: 'isChildSelected',
value: function isChildSelected(child, props) {
var menuValue = this.getValueLink(props).value;
var childValue = child.props.value;
if (props.multiple) {
return menuValue.length && menuValue.indexOf(childValue) !== -1;
} else {
return child.props.hasOwnProperty('value') && menuValue === childValue;
}
}
}, {
key: 'setFocusIndex',
value: function setFocusIndex(newIndex, isKeyboardFocused) {
this.setState({
focusIndex: newIndex,
isKeyboardFocused: isKeyboardFocused
});
}
}, {
key: 'setScollPosition',
value: function setScollPosition() {
var desktop = this.props.desktop;
var focusedMenuItem = this.refs.focusedMenuItem;
var menuItemHeight = desktop ? 32 : 48;
if (focusedMenuItem) {
var selectedOffSet = _reactDom2.default.findDOMNode(focusedMenuItem).offsetTop;
// Make the focused item be the 2nd item in the list the user sees
var scrollTop = selectedOffSet - menuItemHeight;
if (scrollTop < menuItemHeight) scrollTop = 0;
_reactDom2.default.findDOMNode(this.refs.scrollContainer).scrollTop = scrollTop;
}
}
}, {
key: 'setWidth',
value: function setWidth() {
var el = _reactDom2.default.findDOMNode(this);
var listEl = _reactDom2.default.findDOMNode(this.refs.list);
var elWidth = el.offsetWidth;
var keyWidth = this.state.keyWidth;
var minWidth = keyWidth * 1.5;
var keyIncrements = elWidth / keyWidth;
var newWidth = void 0;
keyIncrements = keyIncrements <= 1.5 ? 1.5 : Math.ceil(keyIncrements);
newWidth = keyIncrements * keyWidth;
if (newWidth < minWidth) newWidth = minWidth;
el.style.width = newWidth + 'px';
listEl.style.width = newWidth + 'px';
}
}, {
key: 'render',
value: function render() {
var _this4 = this;
var _props3 = this.props;
var animated = _props3.animated;
var autoWidth = _props3.autoWidth;
var // eslint-disable-line no-unused-vars
children = _props3.children;
var desktop = _props3.desktop;
var initiallyKeyboardFocused = _props3.initiallyKeyboardFocused;
var // eslint-disable-line no-unused-vars
listStyle = _props3.listStyle;
var maxHeight = _props3.maxHeight;
var // eslint-disable-line no-unused-vars
multiple = _props3.multiple;
var _props3$openDirection = _props3.openDirection;
var // eslint-disable-line no-unused-vars
openDirection = _props3$openDirection === undefined ? 'bottom-left' : _props3$openDirection;
var selectedMenuItemStyle = _props3.selectedMenuItemStyle;
var // eslint-disable-line no-unused-vars
style = _props3.style;
var value = _props3.value;
var // eslint-disable-line no-unused-vars
valueLink = _props3.valueLink;
var // eslint-disable-line no-unused-vars
width = _props3.width;
var // eslint-disable-line no-unused-vars
zDepth = _props3.zDepth;
var other = _objectWithoutProperties(_props3, ['animated', 'autoWidth', 'children', 'desktop', 'initiallyKeyboardFocused', 'listStyle', 'maxHeight', 'multiple', 'openDirection', 'selectedMenuItemStyle', 'style', 'value', 'valueLink', 'width', 'zDepth']);
true ? (0, _warning2.default)(typeof zDepth === 'undefined', 'Menu no longer supports `zDepth`. Instead, wrap it in `Paper` ' + 'or another component that provides `zDepth`.') : void 0;
var focusIndex = this.state.focusIndex;
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var mergedRootStyles = (0, _simpleAssign2.default)(styles.root, style);
var mergedListStyles = (0, _simpleAssign2.default)(styles.list, listStyle);
var openDown = openDirection.split('-')[0] === 'bottom';
var filteredChildren = this.getFilteredChildren(children);
// Cascade children opacity
var cumulativeDelay = openDown ? 175 : 325;
var cascadeChildrenCount = this.getCascadeChildrenCount(filteredChildren);
var cumulativeDelayIncrement = Math.ceil(150 / cascadeChildrenCount);
var menuItemIndex = 0;
var newChildren = _react2.default.Children.map(filteredChildren, function (child, index) {
var childIsADivider = child.type && child.type.muiName === 'Divider';
var childIsDisabled = child.props.disabled;
var childrenContainerStyles = {};
if (animated) {
var transitionDelay = 0;
// Only cascade the visible menu items
if (menuItemIndex >= focusIndex - 1 && menuItemIndex <= focusIndex + cascadeChildrenCount - 1) {
cumulativeDelay = openDown ? cumulativeDelay + cumulativeDelayIncrement : cumulativeDelay - cumulativeDelayIncrement;
transitionDelay = cumulativeDelay;
}
childrenContainerStyles = (0, _simpleAssign2.default)({}, styles.menuItemContainer, {
transitionDelay: transitionDelay + 'ms'
});
}
var clonedChild = childIsADivider ? _react2.default.cloneElement(child, { style: styles.divider }) : childIsDisabled ? _react2.default.cloneElement(child, { desktop: desktop }) : _this4.cloneMenuItem(child, menuItemIndex, styles, index);
if (!childIsADivider && !childIsDisabled) menuItemIndex++;
return animated ? _react2.default.createElement(
'div',
{ style: prepareStyles(childrenContainerStyles) },
clonedChild
) : clonedChild;
});
return _react2.default.createElement(
_ClickAwayListener2.default,
{ onClickAway: this.handleClickAway },
_react2.default.createElement(
'div',
{
onKeyDown: this.handleKeyDown,
style: prepareStyles(mergedRootStyles),
ref: 'scrollContainer'
},
_react2.default.createElement(
_List2.default,
_extends({}, other, {
ref: 'list',
style: mergedListStyles
}),
newChildren
)
)
);
}
}]);
return Menu;
}(_react.Component);
Menu.propTypes = {
/**
* If true, the menu will apply transitions when it
* is added to the DOM. In order for transitions to
* work, wrap the menu inside a `ReactTransitionGroup`.
*/
animated: (0, _deprecatedPropType2.default)(_react.PropTypes.bool, 'Instead, use a [Popover](/#/components/popover).'),
/**
* If true, the width of the menu will be set automatically
* according to the widths of its children,
* using proper keyline increments (64px for desktop,
* 56px otherwise).
*/
autoWidth: _react.PropTypes.bool,
/**
* The content of the menu. This is usually used to pass `MenuItem`
* elements.
*/
children: _react.PropTypes.node,
/**
* If true, the menu item will render with compact desktop styles.
*/
desktop: _react.PropTypes.bool,
/**
* If true, the menu will not be auto-focused.
*/
disableAutoFocus: _react.PropTypes.bool,
/**
* If true, the menu will be keyboard-focused initially.
*/
initiallyKeyboardFocused: _react.PropTypes.bool,
/**
* Override the inline-styles of the underlying `List` element.
*/
listStyle: _react.PropTypes.object,
/**
* The maximum height of the menu in pixels. If specified,
* the menu will be scrollable if it is taller than the provided
* height.
*/
maxHeight: _react.PropTypes.number,
/**
* If true, `value` must be an array and the menu will support
* multiple selections.
*/
multiple: _react.PropTypes.bool,
/**
* Callback function fired when a menu item with `value` not
* equal to the current `value` of the menu is touch-tapped.
*
* @param {object} event TouchTap event targeting the menu item.
* @param {any} value If `multiple` is true, the menu's `value`
* array with either the menu item's `value` added (if
* it wasn't already selected) or omitted (if it was already selected).
* Otherwise, the `value` of the menu item.
*/
onChange: _react.PropTypes.func,
/**
* Callback function fired when the menu is focused and the *Esc* key
* is pressed.
*
* @param {object} event `keydown` event targeting the menu.
*/
onEscKeyDown: _react.PropTypes.func,
/**
* Callback function fired when a menu item is touch-tapped.
*
* @param {object} event TouchTap event targeting the menu item.
* @param {object} menuItem The menu item.
* @param {number} index The index of the menu item.
*/
onItemTouchTap: _react.PropTypes.func,
/**
* Callback function fired when the menu is focused and a key
* is pressed.
*
* @param {object} event `keydown` event targeting the menu.
*/
onKeyDown: _react.PropTypes.func,
/**
* This is the placement of the menu relative to the `IconButton`.
*/
openDirection: (0, _deprecatedPropType2.default)(_propTypes2.default.corners, 'Instead, use a [Popover](/#/components/popover).'),
/**
* Override the inline-styles of selected menu items.
*/
selectedMenuItemStyle: _react.PropTypes.object,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* If `multiple` is true, an array of the `value`s of the selected
* menu items. Otherwise, the `value` of the selected menu item.
* If provided, the menu will be a controlled component.
* This component also supports valueLink.
*/
value: _react.PropTypes.any,
/**
* ValueLink for the menu's `value`.
*/
valueLink: _react.PropTypes.object,
/**
* The width of the menu. If not specified, the menu's width
* will be set according to the widths of its children, using
* proper keyline increments (64px for desktop, 56px otherwise).
*/
width: _propTypes2.default.stringOrNumber,
/**
* @ignore
* Menu no longer supports `zDepth`. Instead, wrap it in `Paper`
* or another component that provides zDepth.
*/
zDepth: _propTypes2.default.zDepth
};
Menu.defaultProps = {
autoWidth: true,
desktop: false,
disableAutoFocus: false,
initiallyKeyboardFocused: false,
maxHeight: null,
multiple: false,
onChange: function onChange() {},
onEscKeyDown: function onEscKeyDown() {},
onItemTouchTap: function onItemTouchTap() {},
onKeyDown: function onKeyDown() {}
};
Menu.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
var _initialiseProps = function _initialiseProps() {
var _this5 = this;
this.handleClickAway = function (event) {
if (event.defaultPrevented) {
return;
}
_this5.setFocusIndex(-1, false);
};
this.handleKeyDown = function (event) {
var filteredChildren = _this5.getFilteredChildren(_this5.props.children);
switch ((0, _keycode2.default)(event)) {
case 'down':
event.preventDefault();
_this5.incrementKeyboardFocusIndex(filteredChildren);
break;
case 'esc':
_this5.props.onEscKeyDown(event);
break;
case 'tab':
event.preventDefault();
if (event.shiftKey) {
_this5.decrementKeyboardFocusIndex();
} else {
_this5.incrementKeyboardFocusIndex(filteredChildren);
}
break;
case 'up':
event.preventDefault();
_this5.decrementKeyboardFocusIndex();
break;
}
_this5.props.onKeyDown(event);
};
};
exports.default = Menu;
/***/ },
/* 29 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var tableRowColumn = context.muiTheme.tableRowColumn;
var styles = {
root: {
paddingLeft: tableRowColumn.spacing,
paddingRight: tableRowColumn.spacing,
height: tableRowColumn.height,
textAlign: 'left',
fontSize: 13,
overflow: 'hidden',
whiteSpace: 'nowrap',
textOverflow: 'ellipsis'
}
};
if (_react2.default.Children.count(props.children) === 1 && !isNaN(props.children)) {
styles.textAlign = 'right';
}
return styles;
}
var TableRowColumn = function (_Component) {
_inherits(TableRowColumn, _Component);
function TableRowColumn() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, TableRowColumn);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(TableRowColumn)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
hovered: false
}, _this.onClick = function (event) {
if (_this.props.onClick) _this.props.onClick(event, _this.props.columnNumber);
}, _this.onMouseEnter = function (event) {
if (_this.props.hoverable) {
_this.setState({ hovered: true });
if (_this.props.onHover) _this.props.onHover(event, _this.props.columnNumber);
}
}, _this.onMouseLeave = function (event) {
if (_this.props.hoverable) {
_this.setState({ hovered: false });
if (_this.props.onHoverExit) _this.props.onHoverExit(event, _this.props.columnNumber);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(TableRowColumn, [{
key: 'render',
value: function render() {
var _props = this.props;
var children = _props.children;
var className = _props.className;
var columnNumber = _props.columnNumber;
var // eslint-disable-line no-unused-vars
hoverable = _props.hoverable;
var // eslint-disable-line no-unused-vars
onClick = _props.onClick;
var // eslint-disable-line no-unused-vars
onHover = _props.onHover;
var // eslint-disable-line no-unused-vars
onHoverExit = _props.onHoverExit;
var // eslint-disable-line no-unused-vars
style = _props.style;
var other = _objectWithoutProperties(_props, ['children', 'className', 'columnNumber', 'hoverable', 'onClick', 'onHover', 'onHoverExit', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var handlers = {
onClick: this.onClick,
onMouseEnter: this.onMouseEnter,
onMouseLeave: this.onMouseLeave
};
return _react2.default.createElement(
'td',
_extends({
className: className,
style: prepareStyles((0, _simpleAssign2.default)(styles.root, style))
}, handlers, other),
children
);
}
}]);
return TableRowColumn;
}(_react.Component);
TableRowColumn.propTypes = {
children: _react.PropTypes.node,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* @ignore
* Number to identify the header row. This property
* is automatically populated when used with TableHeader.
*/
columnNumber: _react.PropTypes.number,
/**
* @ignore
* If true, this column responds to hover events.
*/
hoverable: _react.PropTypes.bool,
/**
* @ignore
* Callback function for click event.
*/
onClick: _react.PropTypes.func,
/**
* @ignore
* Callback function for hover event.
*/
onHover: _react.PropTypes.func,
/**
* @ignore
* Callback function for hover exit event.
*/
onHoverExit: _react.PropTypes.func,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
TableRowColumn.defaultProps = {
hoverable: false
};
TableRowColumn.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = TableRowColumn;
/***/ },
/* 30 */
/***/ function(module, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
// helper to capitalize strings
exports.default = function (str) {
return str.charAt(0).toUpperCase() + str.slice(1);
};
module.exports = exports["default"];
/***/ },
/* 31 */
/***/ function(module, exports) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
// returns a style object with a single concated prefixed value string
exports.default = function (property, value) {
var replacer = arguments.length <= 2 || arguments[2] === undefined ? function (prefix, value) {
return prefix + value;
} : arguments[2];
return _defineProperty({}, property, ['-webkit-', '-moz-', ''].map(function (prefix) {
return replacer(prefix, value);
}));
};
module.exports = exports['default'];
/***/ },
/* 32 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _Checkbox = __webpack_require__(107);
var _Checkbox2 = _interopRequireDefault(_Checkbox);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _Checkbox2.default;
/***/ },
/* 33 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _Dialog = __webpack_require__(121);
var _Dialog2 = _interopRequireDefault(_Dialog);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _Dialog2.default;
/***/ },
/* 34 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _FontIcon = __webpack_require__(130);
var _FontIcon2 = _interopRequireDefault(_FontIcon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _FontIcon2.default;
/***/ },
/* 35 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _propTypes = __webpack_require__(9);
var _propTypes2 = _interopRequireDefault(_propTypes);
var _Subheader = __webpack_require__(68);
var _Subheader2 = _interopRequireDefault(_Subheader);
var _deprecatedPropType = __webpack_require__(15);
var _deprecatedPropType2 = _interopRequireDefault(_deprecatedPropType);
var _warning = __webpack_require__(6);
var _warning2 = _interopRequireDefault(_warning);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var List = function (_Component) {
_inherits(List, _Component);
function List() {
_classCallCheck(this, List);
return _possibleConstructorReturn(this, Object.getPrototypeOf(List).apply(this, arguments));
}
_createClass(List, [{
key: 'render',
value: function render() {
var _props = this.props;
var children = _props.children;
var _props$insetSubheader = _props.insetSubheader;
var insetSubheader = _props$insetSubheader === undefined ? false : _props$insetSubheader;
var style = _props.style;
var subheader = _props.subheader;
var subheaderStyle = _props.subheaderStyle;
var zDepth = _props.zDepth;
var other = _objectWithoutProperties(_props, ['children', 'insetSubheader', 'style', 'subheader', 'subheaderStyle', 'zDepth']);
true ? (0, _warning2.default)(typeof zDepth === 'undefined', 'List no longer supports `zDepth`. Instead, wrap it in `Paper` ' + 'or another component that provides zDepth.') : void 0;
var hasSubheader = false;
if (subheader) {
hasSubheader = true;
} else {
var firstChild = _react2.default.Children.toArray(children)[0];
if (_react2.default.isValidElement(firstChild) && firstChild.type === _Subheader2.default) {
hasSubheader = true;
}
}
var styles = {
root: {
padding: 0,
paddingBottom: 8,
paddingTop: hasSubheader ? 0 : 8
}
};
return _react2.default.createElement(
'div',
_extends({}, other, {
style: (0, _simpleAssign2.default)(styles.root, style)
}),
subheader && _react2.default.createElement(
_Subheader2.default,
{ inset: insetSubheader, style: subheaderStyle },
subheader
),
children
);
}
}]);
return List;
}(_react.Component);
List.propTypes = {
/**
* These are usually `ListItem`s that are passed to
* be part of the list.
*/
children: _react.PropTypes.node,
/**
* If true, the subheader will be indented by 72px.
*/
insetSubheader: (0, _deprecatedPropType2.default)(_react.PropTypes.bool, 'Refer to the `subheader` property.'),
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The subheader string that will be displayed at the top of the list.
*/
subheader: (0, _deprecatedPropType2.default)(_react.PropTypes.node, 'Instead, nest the `Subheader` component directly inside the `List`.'),
/**
* Override the inline-styles of the subheader element.
*/
subheaderStyle: (0, _deprecatedPropType2.default)(_react.PropTypes.object, 'Refer to the `subheader` property.'),
/**
* @ignore
* ** Breaking change ** List no longer supports `zDepth`. Instead, wrap it in `Paper`
* or another component that provides zDepth.
*/
zDepth: _propTypes2.default.zDepth
};
List.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = List;
/***/ },
/* 36 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactDom = __webpack_require__(4);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _shallowEqual = __webpack_require__(16);
var _shallowEqual2 = _interopRequireDefault(_shallowEqual);
var _colorManipulator = __webpack_require__(12);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _EnhancedButton = __webpack_require__(11);
var _EnhancedButton2 = _interopRequireDefault(_EnhancedButton);
var _IconButton = __webpack_require__(20);
var _IconButton2 = _interopRequireDefault(_IconButton);
var _expandLess = __webpack_require__(204);
var _expandLess2 = _interopRequireDefault(_expandLess);
var _expandMore = __webpack_require__(205);
var _expandMore2 = _interopRequireDefault(_expandMore);
var _NestedList = __webpack_require__(138);
var _NestedList2 = _interopRequireDefault(_NestedList);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context, state) {
var insetChildren = props.insetChildren;
var leftAvatar = props.leftAvatar;
var leftCheckbox = props.leftCheckbox;
var leftIcon = props.leftIcon;
var nestedLevel = props.nestedLevel;
var rightAvatar = props.rightAvatar;
var rightIcon = props.rightIcon;
var rightIconButton = props.rightIconButton;
var rightToggle = props.rightToggle;
var secondaryText = props.secondaryText;
var secondaryTextLines = props.secondaryTextLines;
var muiTheme = context.muiTheme;
var listItem = muiTheme.listItem;
var textColor = muiTheme.baseTheme.palette.textColor;
var hoverColor = (0, _colorManipulator.fade)(textColor, 0.1);
var singleAvatar = !secondaryText && (leftAvatar || rightAvatar);
var singleNoAvatar = !secondaryText && !(leftAvatar || rightAvatar);
var twoLine = secondaryText && secondaryTextLines === 1;
var threeLine = secondaryText && secondaryTextLines > 1;
var styles = {
root: {
backgroundColor: (state.isKeyboardFocused || state.hovered) && !state.rightIconButtonHovered && !state.rightIconButtonKeyboardFocused ? hoverColor : null,
color: textColor,
display: 'block',
fontSize: 16,
lineHeight: '16px',
position: 'relative',
transition: _transitions2.default.easeOut()
},
// This inner div is needed so that ripples will span the entire container
innerDiv: {
marginLeft: nestedLevel * listItem.nestedLevelDepth,
paddingLeft: leftIcon || leftAvatar || leftCheckbox || insetChildren ? 72 : 16,
paddingRight: rightIcon || rightAvatar || rightIconButton ? 56 : rightToggle ? 72 : 16,
paddingBottom: singleAvatar ? 20 : 16,
paddingTop: singleNoAvatar || threeLine ? 16 : 20,
position: 'relative'
},
icons: {
height: 24,
width: 24,
display: 'block',
position: 'absolute',
top: twoLine ? 12 : singleAvatar ? 4 : 0,
margin: 12
},
leftIcon: {
color: listItem.leftIconColor,
fill: listItem.leftIconColor,
left: 4
},
rightIcon: {
color: listItem.rightIconColor,
fill: listItem.rightIconColor,
right: 4
},
avatars: {
position: 'absolute',
top: singleAvatar ? 8 : 16
},
label: {
cursor: 'pointer'
},
leftAvatar: {
left: 16
},
rightAvatar: {
right: 16
},
leftCheckbox: {
position: 'absolute',
display: 'block',
width: 24,
top: twoLine ? 24 : singleAvatar ? 16 : 12,
left: 16
},
primaryText: {},
rightIconButton: {
position: 'absolute',
display: 'block',
top: twoLine ? 12 : singleAvatar ? 4 : 0,
right: 4
},
rightToggle: {
position: 'absolute',
display: 'block',
width: 54,
top: twoLine ? 25 : singleAvatar ? 17 : 13,
right: 8
},
secondaryText: {
fontSize: 14,
lineHeight: threeLine ? '18px' : '16px',
height: threeLine ? 36 : 16,
margin: 0,
marginTop: 4,
color: listItem.secondaryTextColor,
// needed for 2 and 3 line ellipsis
overflow: 'hidden',
textOverflow: 'ellipsis',
whiteSpace: threeLine ? null : 'nowrap',
display: threeLine ? '-webkit-box' : null,
WebkitLineClamp: threeLine ? 2 : null,
WebkitBoxOrient: threeLine ? 'vertical' : null
}
};
return styles;
}
var ListItem = function (_Component) {
_inherits(ListItem, _Component);
function ListItem() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, ListItem);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(ListItem)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
hovered: false,
isKeyboardFocused: false,
open: _this.props.initiallyOpen,
rightIconButtonHovered: false,
rightIconButtonKeyboardFocused: false,
touch: false
}, _this.handleKeyboardFocus = function (event, isKeyboardFocused) {
_this.setState({ isKeyboardFocused: isKeyboardFocused });
_this.props.onKeyboardFocus(event, isKeyboardFocused);
}, _this.handleMouseEnter = function (event) {
if (!_this.state.touch) _this.setState({ hovered: true });
_this.props.onMouseEnter(event);
}, _this.handleMouseLeave = function (event) {
_this.setState({ hovered: false });
_this.props.onMouseLeave(event);
}, _this.handleNestedListToggle = function (event) {
event.stopPropagation();
_this.setState({ open: !_this.state.open });
_this.props.onNestedListToggle(_this);
}, _this.handleRightIconButtonKeyboardFocus = function (event, isKeyboardFocused) {
if (isKeyboardFocused) {
_this.setState({
isKeyboardFocused: false,
rightIconButtonKeyboardFocused: isKeyboardFocused
});
}
var iconButton = _this.props.rightIconButton;
if (iconButton && iconButton.props.onKeyboardFocus) iconButton.props.onKeyboardFocus(event, isKeyboardFocused);
}, _this.handleRightIconButtonMouseLeave = function (event) {
var iconButton = _this.props.rightIconButton;
_this.setState({ rightIconButtonHovered: false });
if (iconButton && iconButton.props.onMouseLeave) iconButton.props.onMouseLeave(event);
}, _this.handleRightIconButtonMouseEnter = function (event) {
var iconButton = _this.props.rightIconButton;
_this.setState({ rightIconButtonHovered: true });
if (iconButton && iconButton.props.onMouseEnter) iconButton.props.onMouseEnter(event);
}, _this.handleRightIconButtonMouseUp = function (event) {
var iconButton = _this.props.rightIconButton;
event.stopPropagation();
if (iconButton && iconButton.props.onMouseUp) iconButton.props.onMouseUp(event);
}, _this.handleRightIconButtonTouchTap = function (event) {
var iconButton = _this.props.rightIconButton;
// Stop the event from bubbling up to the list-item
event.stopPropagation();
if (iconButton && iconButton.props.onTouchTap) iconButton.props.onTouchTap(event);
}, _this.handleTouchStart = function (event) {
_this.setState({ touch: true });
_this.props.onTouchStart(event);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(ListItem, [{
key: 'shouldComponentUpdate',
value: function shouldComponentUpdate(nextProps, nextState) {
return !(0, _shallowEqual2.default)(this.props, nextProps) || !(0, _shallowEqual2.default)(this.state, nextState);
}
// This method is needed by the `MenuItem` component.
}, {
key: 'applyFocusState',
value: function applyFocusState(focusState) {
var button = this.refs.enhancedButton;
if (button) {
var buttonEl = _reactDom2.default.findDOMNode(button);
switch (focusState) {
case 'none':
buttonEl.blur();
break;
case 'focused':
buttonEl.focus();
break;
case 'keyboard-focused':
button.setKeyboardFocus();
buttonEl.focus();
break;
}
}
}
}, {
key: 'createDisabledElement',
value: function createDisabledElement(styles, contentChildren, additionalProps) {
var _props = this.props;
var innerDivStyle = _props.innerDivStyle;
var style = _props.style;
var mergedDivStyles = (0, _simpleAssign2.default)({}, styles.root, styles.innerDiv, innerDivStyle, style);
return _react2.default.createElement(
'div',
_extends({}, additionalProps, {
style: this.context.muiTheme.prepareStyles(mergedDivStyles)
}),
contentChildren
);
}
}, {
key: 'createLabelElement',
value: function createLabelElement(styles, contentChildren, additionalProps) {
var _props2 = this.props;
var innerDivStyle = _props2.innerDivStyle;
var style = _props2.style;
var mergedLabelStyles = (0, _simpleAssign2.default)({}, styles.root, styles.innerDiv, innerDivStyle, styles.label, style);
return _react2.default.createElement(
'label',
_extends({}, additionalProps, {
style: this.context.muiTheme.prepareStyles(mergedLabelStyles)
}),
contentChildren
);
}
}, {
key: 'createTextElement',
value: function createTextElement(styles, data, key) {
var prepareStyles = this.context.muiTheme.prepareStyles;
if (_react2.default.isValidElement(data)) {
var style = (0, _simpleAssign2.default)({}, styles, data.props.style);
if (typeof data.type === 'string') {
// if element is a native dom node
style = prepareStyles(style);
}
return _react2.default.cloneElement(data, {
key: key,
style: style
});
}
return _react2.default.createElement(
'div',
{ key: key, style: prepareStyles(styles) },
data
);
}
}, {
key: 'pushElement',
value: function pushElement(children, element, baseStyles, additionalProps) {
if (element) {
var styles = (0, _simpleAssign2.default)({}, baseStyles, element.props.style);
children.push(_react2.default.cloneElement(element, _extends({
key: children.length,
style: styles
}, additionalProps)));
}
}
}, {
key: 'render',
value: function render() {
var _props3 = this.props;
var autoGenerateNestedIndicator = _props3.autoGenerateNestedIndicator;
var children = _props3.children;
var disabled = _props3.disabled;
var disableKeyboardFocus = _props3.disableKeyboardFocus;
var innerDivStyle = _props3.innerDivStyle;
var insetChildren = _props3.insetChildren;
var // eslint-disable-line no-unused-vars
leftAvatar = _props3.leftAvatar;
var leftCheckbox = _props3.leftCheckbox;
var leftIcon = _props3.leftIcon;
var nestedItems = _props3.nestedItems;
var nestedLevel = _props3.nestedLevel;
var nestedListStyle = _props3.nestedListStyle;
var onKeyboardFocus = _props3.onKeyboardFocus;
var // eslint-disable-line no-unused-vars
onMouseLeave = _props3.onMouseLeave;
var // eslint-disable-line no-unused-vars
onMouseEnter = _props3.onMouseEnter;
var // eslint-disable-line no-unused-vars
onTouchStart = _props3.onTouchStart;
var // eslint-disable-line no-unused-vars
onTouchTap = _props3.onTouchTap;
var rightAvatar = _props3.rightAvatar;
var rightIcon = _props3.rightIcon;
var rightIconButton = _props3.rightIconButton;
var rightToggle = _props3.rightToggle;
var primaryText = _props3.primaryText;
var primaryTogglesNestedList = _props3.primaryTogglesNestedList;
var secondaryText = _props3.secondaryText;
var secondaryTextLines = _props3.secondaryTextLines;
var // eslint-disable-line no-unused-vars
style = _props3.style;
var other = _objectWithoutProperties(_props3, ['autoGenerateNestedIndicator', 'children', 'disabled', 'disableKeyboardFocus', 'innerDivStyle', 'insetChildren', 'leftAvatar', 'leftCheckbox', 'leftIcon', 'nestedItems', 'nestedLevel', 'nestedListStyle', 'onKeyboardFocus', 'onMouseLeave', 'onMouseEnter', 'onTouchStart', 'onTouchTap', 'rightAvatar', 'rightIcon', 'rightIconButton', 'rightToggle', 'primaryText', 'primaryTogglesNestedList', 'secondaryText', 'secondaryTextLines', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context, this.state);
var contentChildren = [children];
if (leftIcon) {
this.pushElement(contentChildren, leftIcon, (0, _simpleAssign2.default)({}, styles.icons, styles.leftIcon));
}
if (rightIcon) {
this.pushElement(contentChildren, rightIcon, (0, _simpleAssign2.default)({}, styles.icons, styles.rightIcon));
}
if (leftAvatar) {
this.pushElement(contentChildren, leftAvatar, (0, _simpleAssign2.default)({}, styles.avatars, styles.leftAvatar));
}
if (rightAvatar) {
this.pushElement(contentChildren, rightAvatar, (0, _simpleAssign2.default)({}, styles.avatars, styles.rightAvatar));
}
if (leftCheckbox) {
this.pushElement(contentChildren, leftCheckbox, (0, _simpleAssign2.default)({}, styles.leftCheckbox));
}
// RightIconButtonElement
var hasNestListItems = nestedItems.length;
var hasRightElement = rightAvatar || rightIcon || rightIconButton || rightToggle;
var needsNestedIndicator = hasNestListItems && autoGenerateNestedIndicator && !hasRightElement;
if (rightIconButton || needsNestedIndicator) {
var rightIconButtonElement = rightIconButton;
var rightIconButtonHandlers = {
onKeyboardFocus: this.handleRightIconButtonKeyboardFocus,
onMouseEnter: this.handleRightIconButtonMouseEnter,
onMouseLeave: this.handleRightIconButtonMouseLeave,
onTouchTap: this.handleRightIconButtonTouchTap,
onMouseDown: this.handleRightIconButtonMouseUp,
onMouseUp: this.handleRightIconButtonMouseUp
};
// Create a nested list indicator icon if we don't have an icon on the right
if (needsNestedIndicator) {
rightIconButtonElement = this.state.open ? _react2.default.createElement(
_IconButton2.default,
null,
_react2.default.createElement(_expandLess2.default, null)
) : _react2.default.createElement(
_IconButton2.default,
null,
_react2.default.createElement(_expandMore2.default, null)
);
rightIconButtonHandlers.onTouchTap = this.handleNestedListToggle;
}
this.pushElement(contentChildren, rightIconButtonElement, (0, _simpleAssign2.default)({}, styles.rightIconButton), rightIconButtonHandlers);
}
if (rightToggle) {
this.pushElement(contentChildren, rightToggle, (0, _simpleAssign2.default)({}, styles.rightToggle));
}
if (primaryText) {
var primaryTextElement = this.createTextElement(styles.primaryText, primaryText, 'primaryText');
contentChildren.push(primaryTextElement);
}
if (secondaryText) {
var secondaryTextElement = this.createTextElement(styles.secondaryText, secondaryText, 'secondaryText');
contentChildren.push(secondaryTextElement);
}
var nestedList = nestedItems.length ? _react2.default.createElement(
_NestedList2.default,
{ nestedLevel: nestedLevel + 1, open: this.state.open, style: nestedListStyle },
nestedItems
) : undefined;
var hasCheckbox = leftCheckbox || rightToggle;
return _react2.default.createElement(
'div',
null,
hasCheckbox ? this.createLabelElement(styles, contentChildren, other) : disabled ? this.createDisabledElement(styles, contentChildren, other) : _react2.default.createElement(
_EnhancedButton2.default,
_extends({
containerElement: 'span'
}, other, {
disabled: disabled,
disableKeyboardFocus: disableKeyboardFocus || this.state.rightIconButtonKeyboardFocused,
onKeyboardFocus: this.handleKeyboardFocus,
onMouseLeave: this.handleMouseLeave,
onMouseEnter: this.handleMouseEnter,
onTouchStart: this.handleTouchStart,
onTouchTap: primaryTogglesNestedList ? this.handleNestedListToggle : onTouchTap,
ref: 'enhancedButton',
style: (0, _simpleAssign2.default)({}, styles.root, style)
}),
_react2.default.createElement(
'div',
{ style: prepareStyles((0, _simpleAssign2.default)(styles.innerDiv, innerDivStyle)) },
contentChildren
)
),
nestedList
);
}
}]);
return ListItem;
}(_react.Component);
ListItem.muiName = 'ListItem';
ListItem.propTypes = {
/**
* If true, generate a nested-list-indicator icon when nested list
* items are detected. Note that an indicator will not be created
* if a `rightIcon` or `rightIconButton` has been provided to
* the element.
*/
autoGenerateNestedIndicator: _react.PropTypes.bool,
/**
* Children passed into the `ListItem`.
*/
children: _react.PropTypes.node,
/**
* If true, the element will not be able to be focused by the keyboard.
*/
disableKeyboardFocus: _react.PropTypes.bool,
/**
* If true, the element will not be clickable
* and will not display hover effects.
* This is automatically disabled if either `leftCheckbox`
* or `rightToggle` is set.
*/
disabled: _react.PropTypes.bool,
/**
* If true, the nested `ListItem`s are initially displayed.
*/
initiallyOpen: _react.PropTypes.bool,
/**
* Override the inline-styles of the inner div element.
*/
innerDivStyle: _react.PropTypes.object,
/**
* If true, the children will be indented by 72px.
* This is useful if there is no left avatar or left icon.
*/
insetChildren: _react.PropTypes.bool,
/**
* This is the `Avatar` element to be displayed on the left side.
*/
leftAvatar: _react.PropTypes.element,
/**
* This is the `Checkbox` element to be displayed on the left side.
*/
leftCheckbox: _react.PropTypes.element,
/**
* This is the `SvgIcon` or `FontIcon` to be displayed on the left side.
*/
leftIcon: _react.PropTypes.element,
/**
* An array of `ListItem`s to nest underneath the current `ListItem`.
*/
nestedItems: _react.PropTypes.arrayOf(_react.PropTypes.element),
/**
* Controls how deep a `ListItem` appears.
* This property is automatically managed, so modify at your own risk.
*/
nestedLevel: _react.PropTypes.number,
/**
* Override the inline-styles of the nested items' `NestedList`.
*/
nestedListStyle: _react.PropTypes.object,
/**
* Callback function fired when the `ListItem` is focused or blurred by the keyboard.
*
* @param {object} event `focus` or `blur` event targeting the `ListItem`.
* @param {boolean} isKeyboardFocused If true, the `ListItem` is focused.
*/
onKeyboardFocus: _react.PropTypes.func,
/**
* Callback function fired when the mouse enters the `ListItem`.
*
* @param {object} event `mouseenter` event targeting the `ListItem`.
*/
onMouseEnter: _react.PropTypes.func,
/**
* Callback function fired when the mouse leaves the `ListItem`.
*
* @param {object} event `mouseleave` event targeting the `ListItem`.
*/
onMouseLeave: _react.PropTypes.func,
/**
* Callbak function fired when the `ListItem` toggles its nested list.
*
* @param {object} listItem The `ListItem`.
*/
onNestedListToggle: _react.PropTypes.func,
/**
* Callback function fired when the `ListItem` is touched.
*
* @param {object} event `touchstart` event targeting the `ListItem`.
*/
onTouchStart: _react.PropTypes.func,
/**
* Callback function fired when the `ListItem` is touch-tapped.
*
* @param {object} event TouchTap event targeting the `ListItem`.
*/
onTouchTap: _react.PropTypes.func,
/**
* This is the block element that contains the primary text.
* If a string is passed in, a div tag will be rendered.
*/
primaryText: _react.PropTypes.node,
/**
* If true, clicking or tapping the primary text of the `ListItem`
* toggles the nested list.
*/
primaryTogglesNestedList: _react.PropTypes.bool,
/**
* This is the `Avatar` element to be displayed on the right side.
*/
rightAvatar: _react.PropTypes.element,
/**
* This is the `SvgIcon` or `FontIcon` to be displayed on the right side.
*/
rightIcon: _react.PropTypes.element,
/**
* This is the `IconButton` to be displayed on the right side.
* Hovering over this button will remove the `ListItem` hover.
* Also, clicking on this button will not trigger a
* ripple on the `ListItem`; the event will be stopped and prevented
* from bubbling up to cause a `ListItem` click.
*/
rightIconButton: _react.PropTypes.element,
/**
* This is the `Toggle` element to display on the right side.
*/
rightToggle: _react.PropTypes.element,
/**
* This is the block element that contains the secondary text.
* If a string is passed in, a div tag will be rendered.
*/
secondaryText: _react.PropTypes.node,
/**
* Can be 1 or 2. This is the number of secondary
* text lines before ellipsis will show.
*/
secondaryTextLines: _react.PropTypes.oneOf([1, 2]),
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
ListItem.defaultProps = {
autoGenerateNestedIndicator: true,
disableKeyboardFocus: false,
disabled: false,
initiallyOpen: false,
insetChildren: false,
nestedItems: [],
nestedLevel: 0,
onKeyboardFocus: function onKeyboardFocus() {},
onMouseEnter: function onMouseEnter() {},
onMouseLeave: function onMouseLeave() {},
onNestedListToggle: function onNestedListToggle() {},
onTouchStart: function onTouchStart() {},
primaryTogglesNestedList: false,
secondaryTextLines: 1
};
ListItem.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = ListItem;
/***/ },
/* 37 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactDom = __webpack_require__(4);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _shallowEqual = __webpack_require__(16);
var _shallowEqual2 = _interopRequireDefault(_shallowEqual);
var _Popover = __webpack_require__(18);
var _Popover2 = _interopRequireDefault(_Popover);
var _check = __webpack_require__(201);
var _check2 = _interopRequireDefault(_check);
var _ListItem = __webpack_require__(36);
var _ListItem2 = _interopRequireDefault(_ListItem);
var _Menu = __webpack_require__(28);
var _Menu2 = _interopRequireDefault(_Menu);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var nestedMenuStyle = {
position: 'relative'
};
function getStyles(props, context) {
var disabledColor = context.muiTheme.baseTheme.palette.disabledColor;
var textColor = context.muiTheme.baseTheme.palette.textColor;
var leftIndent = props.desktop ? 64 : 72;
var sidePadding = props.desktop ? 24 : 16;
var styles = {
root: {
color: props.disabled ? disabledColor : textColor,
lineHeight: props.desktop ? '32px' : '48px',
fontSize: props.desktop ? 15 : 16,
whiteSpace: 'nowrap'
},
innerDivStyle: {
paddingLeft: props.leftIcon || props.insetChildren || props.checked ? leftIndent : sidePadding,
paddingRight: sidePadding,
paddingBottom: 0,
paddingTop: 0
},
secondaryText: {
float: 'right'
},
leftIconDesktop: {
margin: 0,
left: 24,
top: 4
},
rightIconDesktop: {
margin: 0,
right: 24,
top: 4,
fill: context.muiTheme.menuItem.rightIconDesktopFill
}
};
return styles;
}
var MenuItem = function (_Component) {
_inherits(MenuItem, _Component);
function MenuItem() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, MenuItem);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(MenuItem)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
open: false
}, _this.cloneMenuItem = function (item) {
return _react2.default.cloneElement(item, {
onTouchTap: function onTouchTap(event) {
if (!item.props.menuItems) {
_this.handleRequestClose();
}
if (item.props.onTouchTap) {
item.props.onTouchTap(event);
}
},
onRequestClose: _this.handleRequestClose
});
}, _this.handleTouchTap = function (event) {
event.preventDefault();
_this.setState({
open: true,
anchorEl: _reactDom2.default.findDOMNode(_this)
});
if (_this.props.onTouchTap) {
_this.props.onTouchTap(event);
}
}, _this.handleRequestClose = function () {
_this.setState({
open: false,
anchorEl: null
});
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(MenuItem, [{
key: 'componentDidMount',
value: function componentDidMount() {
this.applyFocusState();
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (this.state.open && nextProps.focusState === 'none') {
this.handleRequestClose();
}
}
}, {
key: 'shouldComponentUpdate',
value: function shouldComponentUpdate(nextProps, nextState) {
return !(0, _shallowEqual2.default)(this.props, nextProps) || !(0, _shallowEqual2.default)(this.state, nextState);
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
this.applyFocusState();
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
if (this.state.open) {
this.setState({
open: false
});
}
}
}, {
key: 'applyFocusState',
value: function applyFocusState() {
this.refs.listItem.applyFocusState(this.props.focusState);
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var checked = _props.checked;
var children = _props.children;
var desktop = _props.desktop;
var disabled = _props.disabled;
var focusState = _props.focusState;
var // eslint-disable-line no-unused-vars
innerDivStyle = _props.innerDivStyle;
var insetChildren = _props.insetChildren;
var leftIcon = _props.leftIcon;
var menuItems = _props.menuItems;
var rightIcon = _props.rightIcon;
var secondaryText = _props.secondaryText;
var style = _props.style;
var value = _props.value;
var other = _objectWithoutProperties(_props, ['checked', 'children', 'desktop', 'disabled', 'focusState', 'innerDivStyle', 'insetChildren', 'leftIcon', 'menuItems', 'rightIcon', 'secondaryText', 'style', 'value']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var mergedRootStyles = (0, _simpleAssign2.default)(styles.root, style);
var mergedInnerDivStyles = (0, _simpleAssign2.default)(styles.innerDivStyle, innerDivStyle);
// Left Icon
var leftIconElement = leftIcon ? leftIcon : checked ? _react2.default.createElement(_check2.default, null) : null;
if (leftIconElement && desktop) {
var mergedLeftIconStyles = (0, _simpleAssign2.default)(styles.leftIconDesktop, leftIconElement.props.style);
leftIconElement = _react2.default.cloneElement(leftIconElement, { style: mergedLeftIconStyles });
}
// Right Icon
var rightIconElement = void 0;
if (rightIcon) {
var mergedRightIconStyles = desktop ? (0, _simpleAssign2.default)(styles.rightIconDesktop, rightIcon.props.style) : rightIcon.props.style;
rightIconElement = _react2.default.cloneElement(rightIcon, { style: mergedRightIconStyles });
}
// Secondary Text
var secondaryTextElement = void 0;
if (secondaryText) {
var secondaryTextIsAnElement = _react2.default.isValidElement(secondaryText);
var mergedSecondaryTextStyles = secondaryTextIsAnElement ? (0, _simpleAssign2.default)(styles.secondaryText, secondaryText.props.style) : null;
secondaryTextElement = secondaryTextIsAnElement ? _react2.default.cloneElement(secondaryText, { style: mergedSecondaryTextStyles }) : _react2.default.createElement(
'div',
{ style: prepareStyles(styles.secondaryText) },
secondaryText
);
}
var childMenuPopover = void 0;
if (menuItems) {
childMenuPopover = _react2.default.createElement(
_Popover2.default,
{
anchorOrigin: { horizontal: 'right', vertical: 'top' },
anchorEl: this.state.anchorEl,
open: this.state.open,
useLayerForClickAway: false,
onRequestClose: this.handleRequestClose
},
_react2.default.createElement(
_Menu2.default,
{ desktop: desktop, disabled: disabled, style: nestedMenuStyle },
_react2.default.Children.map(menuItems, this.cloneMenuItem)
)
);
other.onTouchTap = this.handleTouchTap;
}
return _react2.default.createElement(
_ListItem2.default,
_extends({}, other, {
disabled: disabled,
innerDivStyle: mergedInnerDivStyles,
insetChildren: insetChildren,
leftIcon: leftIconElement,
ref: 'listItem',
rightIcon: rightIconElement,
style: mergedRootStyles
}),
children,
secondaryTextElement,
childMenuPopover
);
}
}]);
return MenuItem;
}(_react.Component);
MenuItem.muiName = 'MenuItem';
MenuItem.propTypes = {
/**
* If true, a left check mark will be rendered.
*/
checked: _react.PropTypes.bool,
/**
* Elements passed as children to the underlying `ListItem`.
*/
children: _react.PropTypes.node,
/**
* @ignore
* If true, the menu item will render with compact desktop
* styles.
*/
desktop: _react.PropTypes.bool,
/**
* If true, the menu item will be disabled.
*/
disabled: _react.PropTypes.bool,
/**
* The focus state of the menu item. This prop is used to set the focus
* state of the underlying `ListItem`.
*/
focusState: _react.PropTypes.oneOf(['none', 'focused', 'keyboard-focused']),
/**
* Override the inline-styles of the inner div.
*/
innerDivStyle: _react.PropTypes.object,
/**
* If true, the children will be indented.
* This is only needed when there is no `leftIcon`.
*/
insetChildren: _react.PropTypes.bool,
/**
* The `SvgIcon` or `FontIcon` to be displayed on the left side.
*/
leftIcon: _react.PropTypes.element,
/**
* `MenuItem` elements to nest within the menu item.
*/
menuItems: _react.PropTypes.node,
/**
* Callback function fired when the menu item is touch-tapped.
*
* @param {object} event TouchTap event targeting the menu item.
*/
onTouchTap: _react.PropTypes.func,
/**
* Can be used to render primary text within the menu item.
*/
primaryText: _react.PropTypes.node,
/**
* The `SvgIcon` or `FontIcon` to be displayed on the right side.
*/
rightIcon: _react.PropTypes.element,
/**
* Can be used to render secondary text within the menu item.
*/
secondaryText: _react.PropTypes.node,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The value of the menu item.
*/
value: _react.PropTypes.any
};
MenuItem.defaultProps = {
checked: false,
desktop: false,
disabled: false,
focusState: 'none',
insetChildren: false
};
MenuItem.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = MenuItem;
/***/ },
/* 38 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _MenuItem = __webpack_require__(37);
var _MenuItem2 = _interopRequireDefault(_MenuItem);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _MenuItem2.default;
/***/ },
/* 39 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _Paper = __webpack_require__(8);
var _Paper2 = _interopRequireDefault(_Paper);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _propTypes = __webpack_require__(9);
var _propTypes2 = _interopRequireDefault(_propTypes);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context, state) {
var targetOrigin = props.targetOrigin;
var open = state.open;
var muiTheme = context.muiTheme;
var horizontal = targetOrigin.horizontal.replace('middle', 'vertical');
return {
root: {
opacity: open ? 1 : 0,
transform: open ? 'scaleY(1)' : 'scaleY(0)',
transformOrigin: horizontal + ' ' + targetOrigin.vertical,
position: 'fixed',
zIndex: muiTheme.zIndex.popover,
transition: _transitions2.default.easeOut('450ms', ['transform', 'opacity']),
maxHeight: '100%'
}
};
}
var PopoverAnimationVertical = function (_Component) {
_inherits(PopoverAnimationVertical, _Component);
function PopoverAnimationVertical() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, PopoverAnimationVertical);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(PopoverAnimationVertical)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
open: false
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(PopoverAnimationVertical, [{
key: 'componentDidMount',
value: function componentDidMount() {
this.setState({ open: true }); // eslint-disable-line react/no-did-mount-set-state
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
this.setState({
open: nextProps.open
});
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var className = _props.className;
var style = _props.style;
var zDepth = _props.zDepth;
var styles = getStyles(this.props, this.context, this.state);
return _react2.default.createElement(
_Paper2.default,
{
style: (0, _simpleAssign2.default)(styles.root, style),
zDepth: zDepth,
className: className
},
this.props.children
);
}
}]);
return PopoverAnimationVertical;
}(_react.Component);
PopoverAnimationVertical.propTypes = {
children: _react.PropTypes.node,
className: _react.PropTypes.string,
open: _react.PropTypes.bool.isRequired,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
targetOrigin: _propTypes2.default.origin,
zDepth: _propTypes2.default.zDepth
};
PopoverAnimationVertical.defaultProps = {
style: {},
zDepth: 1
};
PopoverAnimationVertical.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = PopoverAnimationVertical;
/***/ },
/* 40 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _Tooltip = __webpack_require__(82);
var _Tooltip2 = _interopRequireDefault(_Tooltip);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var tableHeaderColumn = context.muiTheme.tableHeaderColumn;
return {
root: {
fontWeight: 'normal',
fontSize: 12,
paddingLeft: tableHeaderColumn.spacing,
paddingRight: tableHeaderColumn.spacing,
height: tableHeaderColumn.height,
textAlign: 'left',
whiteSpace: 'nowrap',
textOverflow: 'ellipsis',
color: tableHeaderColumn.textColor,
position: 'relative'
},
tooltip: {
boxSizing: 'border-box',
marginTop: tableHeaderColumn.height / 2
}
};
}
var TableHeaderColumn = function (_Component) {
_inherits(TableHeaderColumn, _Component);
function TableHeaderColumn() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, TableHeaderColumn);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(TableHeaderColumn)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
hovered: false
}, _this.onMouseEnter = function () {
if (_this.props.tooltip !== undefined) _this.setState({ hovered: true });
}, _this.onMouseLeave = function () {
if (_this.props.tooltip !== undefined) _this.setState({ hovered: false });
}, _this.onClick = function (event) {
if (_this.props.onClick) _this.props.onClick(event, _this.props.columnNumber);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(TableHeaderColumn, [{
key: 'render',
value: function render() {
var _props = this.props;
var children = _props.children;
var className = _props.className;
var columnNumber = _props.columnNumber;
var // eslint-disable-line no-unused-vars
onClick = _props.onClick;
var // eslint-disable-line no-unused-vars
style = _props.style;
var tooltip = _props.tooltip;
var tooltipStyle = _props.tooltipStyle;
var other = _objectWithoutProperties(_props, ['children', 'className', 'columnNumber', 'onClick', 'style', 'tooltip', 'tooltipStyle']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var handlers = {
onMouseEnter: this.onMouseEnter,
onMouseLeave: this.onMouseLeave,
onClick: this.onClick
};
var tooltipNode = void 0;
if (tooltip !== undefined) {
tooltipNode = _react2.default.createElement(_Tooltip2.default, {
label: tooltip,
show: this.state.hovered,
style: (0, _simpleAssign2.default)(styles.tooltip, tooltipStyle)
});
}
return _react2.default.createElement(
'th',
_extends({
className: className,
style: prepareStyles((0, _simpleAssign2.default)(styles.root, style))
}, handlers, other),
tooltipNode,
children
);
}
}]);
return TableHeaderColumn;
}(_react.Component);
TableHeaderColumn.propTypes = {
children: _react.PropTypes.node,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* Number to identify the header row. This property
* is automatically populated when used with TableHeader.
*/
columnNumber: _react.PropTypes.number,
/**
* @ignore
* Callback function for click event.
*/
onClick: _react.PropTypes.func,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The string to supply to the tooltip. If not
* string is supplied no tooltip will be shown.
*/
tooltip: _react.PropTypes.string,
/**
* Additional styling that can be applied to the tooltip.
*/
tooltipStyle: _react.PropTypes.object
};
TableHeaderColumn.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = TableHeaderColumn;
/***/ },
/* 41 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _reactDom = __webpack_require__(4);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _events = __webpack_require__(47);
var _events2 = _interopRequireDefault(_events);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var isDescendant = function isDescendant(el, target) {
if (target !== null) {
return el === target || isDescendant(el, target.parentNode);
}
return false;
};
var clickAwayEvents = ['mouseup', 'touchend'];
var bind = function bind(callback) {
return clickAwayEvents.forEach(function (event) {
return _events2.default.on(document, event, callback);
});
};
var unbind = function unbind(callback) {
return clickAwayEvents.forEach(function (event) {
return _events2.default.off(document, event, callback);
});
};
var ClickAwayListener = function (_Component) {
_inherits(ClickAwayListener, _Component);
function ClickAwayListener() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, ClickAwayListener);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(ClickAwayListener)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.handleClickAway = function (event) {
if (event.defaultPrevented) {
return;
}
var el = _reactDom2.default.findDOMNode(_this);
if (document.documentElement.contains(event.target) && !isDescendant(el, event.target)) {
_this.props.onClickAway(event);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(ClickAwayListener, [{
key: 'componentDidMount',
value: function componentDidMount() {
if (this.props.onClickAway) {
bind(this.handleClickAway);
}
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate(prevProps) {
if (prevProps.onClickAway !== this.props.onClickAway) {
unbind(this.handleClickAway);
if (this.props.onClickAway) {
bind(this.handleClickAway);
}
}
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
unbind(this.handleClickAway);
}
}, {
key: 'render',
value: function render() {
return this.props.children;
}
}]);
return ClickAwayListener;
}(_react.Component);
ClickAwayListener.propTypes = {
children: _react.PropTypes.node,
onClickAway: _react.PropTypes.any
};
exports.default = ClickAwayListener;
/***/ },
/* 42 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactEventListener = __webpack_require__(13);
var _reactEventListener2 = _interopRequireDefault(_reactEventListener);
var _keycode = __webpack_require__(10);
var _keycode2 = _interopRequireDefault(_keycode);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _FocusRipple = __webpack_require__(43);
var _FocusRipple2 = _interopRequireDefault(_FocusRipple);
var _TouchRipple = __webpack_require__(83);
var _TouchRipple2 = _interopRequireDefault(_TouchRipple);
var _Paper = __webpack_require__(8);
var _Paper2 = _interopRequireDefault(_Paper);
var _warning = __webpack_require__(6);
var _warning2 = _interopRequireDefault(_warning);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var baseTheme = context.muiTheme.baseTheme;
return {
root: {
position: 'relative',
cursor: props.disabled ? 'default' : 'pointer',
overflow: 'visible',
display: 'table',
height: 'auto',
width: '100%'
},
input: {
position: 'absolute',
cursor: props.disabled ? 'default' : 'pointer',
pointerEvents: 'all',
opacity: 0,
width: '100%',
height: '100%',
zIndex: 2,
left: 0,
boxSizing: 'border-box',
padding: 0,
margin: 0
},
controls: {
display: 'flex',
width: '100%',
height: '100%'
},
label: {
float: 'left',
position: 'relative',
display: 'block',
width: 'calc(100% - 60px)',
lineHeight: '24px',
color: baseTheme.palette.textColor,
fontFamily: baseTheme.fontFamily
},
wrap: {
transition: _transitions2.default.easeOut(),
float: 'left',
position: 'relative',
display: 'block',
flexShrink: 0,
width: 60 - baseTheme.spacing.desktopGutterLess,
marginRight: props.labelPosition === 'right' ? baseTheme.spacing.desktopGutterLess : 0,
marginLeft: props.labelPosition === 'left' ? baseTheme.spacing.desktopGutterLess : 0
},
ripple: {
color: props.rippleColor || baseTheme.palette.primary1Color,
height: '200%',
width: '200%',
top: -12,
left: -12
}
};
}
var EnhancedSwitch = function (_Component) {
_inherits(EnhancedSwitch, _Component);
function EnhancedSwitch() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, EnhancedSwitch);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(EnhancedSwitch)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
isKeyboardFocused: false
}, _this.handleChange = function (event) {
_this.tabPressed = false;
_this.setState({
isKeyboardFocused: false
});
var isInputChecked = _this.refs.checkbox.checked;
if (!_this.props.hasOwnProperty('checked') && _this.props.onParentShouldUpdate) {
_this.props.onParentShouldUpdate(isInputChecked);
}
if (_this.props.onSwitch) {
_this.props.onSwitch(event, isInputChecked);
}
}, _this.handleKeyDown = function (event) {
var code = (0, _keycode2.default)(event);
if (code === 'tab') {
_this.tabPressed = true;
}
if (_this.state.isKeyboardFocused && code === 'space') {
_this.handleChange(event);
}
}, _this.handleKeyUp = function (event) {
if (_this.state.isKeyboardFocused && (0, _keycode2.default)(event) === 'space') {
_this.handleChange(event);
}
}, _this.handleMouseDown = function (event) {
// only listen to left clicks
if (event.button === 0) {
_this.refs.touchRipple.start(event);
}
}, _this.handleMouseUp = function () {
_this.refs.touchRipple.end();
}, _this.handleMouseLeave = function () {
_this.refs.touchRipple.end();
}, _this.handleTouchStart = function (event) {
_this.refs.touchRipple.start(event);
}, _this.handleTouchEnd = function () {
_this.refs.touchRipple.end();
}, _this.handleBlur = function (event) {
_this.setState({
isKeyboardFocused: false
});
if (_this.props.onBlur) {
_this.props.onBlur(event);
}
}, _this.handleFocus = function (event) {
// setTimeout is needed becuase the focus event fires first
// Wait so that we can capture if this was a keyboard focus
// or touch focus
setTimeout(function () {
if (_this.tabPressed) {
_this.setState({
isKeyboardFocused: true
});
}
}, 150);
if (_this.props.onFocus) {
_this.props.onFocus(event);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(EnhancedSwitch, [{
key: 'componentDidMount',
value: function componentDidMount() {
var inputNode = this.refs.checkbox;
if ((!this.props.switched || inputNode.checked !== this.props.switched) && this.props.onParentShouldUpdate) {
this.props.onParentShouldUpdate(inputNode.checked);
}
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
var hasCheckedProp = nextProps.hasOwnProperty('checked');
var hasToggledProp = nextProps.hasOwnProperty('toggled');
var hasNewDefaultProp = nextProps.hasOwnProperty('defaultChecked') && nextProps.defaultChecked !== this.props.defaultChecked;
if (hasCheckedProp || hasToggledProp || hasNewDefaultProp) {
var switched = nextProps.checked || nextProps.toggled || nextProps.defaultChecked || false;
this.setState({
switched: switched
});
if (this.props.onParentShouldUpdate && switched !== this.props.switched) {
this.props.onParentShouldUpdate(switched);
}
}
}
}, {
key: 'isSwitched',
value: function isSwitched() {
return this.refs.checkbox.checked;
}
// no callback here because there is no event
}, {
key: 'setSwitched',
value: function setSwitched(newSwitchedValue) {
if (!this.props.hasOwnProperty('checked') || this.props.checked === false) {
if (this.props.onParentShouldUpdate) {
this.props.onParentShouldUpdate(newSwitchedValue);
}
this.refs.checkbox.checked = newSwitchedValue;
} else {
true ? (0, _warning2.default)(false, 'Cannot call set method while checked is defined as a property.') : void 0;
}
}
}, {
key: 'getValue',
value: function getValue() {
return this.refs.checkbox.value;
}
// Checkbox inputs only use SPACE to change their state. Using ENTER will
// update the ui but not the input.
/**
* Because both the ripples and the checkbox input cannot share pointer
* events, the checkbox input takes control of pointer events and calls
* ripple animations manually.
*/
}, {
key: 'render',
value: function render() {
var _props = this.props;
var name = _props.name;
var value = _props.value;
var iconStyle = _props.iconStyle;
var inputStyle = _props.inputStyle;
var inputType = _props.inputType;
var label = _props.label;
var labelStyle = _props.labelStyle;
var labelPosition = _props.labelPosition;
var onSwitch = _props.onSwitch;
var // eslint-disable-line no-unused-vars
onBlur = _props.onBlur;
var // eslint-disable-line no-unused-vars
onFocus = _props.onFocus;
var // eslint-disable-line no-unused-vars
onMouseUp = _props.onMouseUp;
var // eslint-disable-line no-unused-vars
onMouseDown = _props.onMouseDown;
var // eslint-disable-line no-unused-vars
onMouseLeave = _props.onMouseLeave;
var // eslint-disable-line no-unused-vars
onTouchStart = _props.onTouchStart;
var // eslint-disable-line no-unused-vars
onTouchEnd = _props.onTouchEnd;
var // eslint-disable-line no-unused-vars
disabled = _props.disabled;
var disableTouchRipple = _props.disableTouchRipple;
var disableFocusRipple = _props.disableFocusRipple;
var className = _props.className;
var rippleStyle = _props.rippleStyle;
var style = _props.style;
var switched = _props.switched;
var // eslint-disable-line no-unused-vars
switchElement = _props.switchElement;
var thumbStyle = _props.thumbStyle;
var trackStyle = _props.trackStyle;
var other = _objectWithoutProperties(_props, ['name', 'value', 'iconStyle', 'inputStyle', 'inputType', 'label', 'labelStyle', 'labelPosition', 'onSwitch', 'onBlur', 'onFocus', 'onMouseUp', 'onMouseDown', 'onMouseLeave', 'onTouchStart', 'onTouchEnd', 'disabled', 'disableTouchRipple', 'disableFocusRipple', 'className', 'rippleStyle', 'style', 'switched', 'switchElement', 'thumbStyle', 'trackStyle']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var wrapStyles = (0, _simpleAssign2.default)(styles.wrap, iconStyle);
var mergedRippleStyle = (0, _simpleAssign2.default)(styles.ripple, rippleStyle);
if (thumbStyle) {
wrapStyles.marginLeft /= 2;
wrapStyles.marginRight /= 2;
}
var labelElement = label && _react2.default.createElement(
'label',
{ style: prepareStyles((0, _simpleAssign2.default)(styles.label, labelStyle)) },
label
);
var showTouchRipple = !disabled && !disableTouchRipple;
var showFocusRipple = !disabled && !disableFocusRipple;
var touchRipple = _react2.default.createElement(_TouchRipple2.default, {
ref: 'touchRipple',
key: 'touchRipple',
style: mergedRippleStyle,
color: mergedRippleStyle.color,
muiTheme: this.context.muiTheme,
centerRipple: true
});
var focusRipple = _react2.default.createElement(_FocusRipple2.default, {
key: 'focusRipple',
innerStyle: mergedRippleStyle,
color: mergedRippleStyle.color,
muiTheme: this.context.muiTheme,
show: this.state.isKeyboardFocused
});
var ripples = [showTouchRipple ? touchRipple : null, showFocusRipple ? focusRipple : null];
var inputElement = _react2.default.createElement('input', _extends({}, other, {
ref: 'checkbox',
type: inputType,
style: prepareStyles((0, _simpleAssign2.default)(styles.input, inputStyle)),
name: name,
value: value,
disabled: disabled,
onBlur: this.handleBlur,
onFocus: this.handleFocus,
onChange: this.handleChange,
onMouseUp: showTouchRipple && this.handleMouseUp,
onMouseDown: showTouchRipple && this.handleMouseDown,
onMouseLeave: showTouchRipple && this.handleMouseLeave,
onTouchStart: showTouchRipple && this.handleTouchStart,
onTouchEnd: showTouchRipple && this.handleTouchEnd
}));
// If toggle component (indicated by whether the style includes thumb) manually lay out
// elements in order to nest ripple elements
var switchOrThumbElement = !thumbStyle ? _react2.default.createElement(
'div',
{ style: prepareStyles(wrapStyles) },
switchElement,
ripples
) : _react2.default.createElement(
'div',
{ style: prepareStyles(wrapStyles) },
_react2.default.createElement('div', { style: prepareStyles((0, _simpleAssign2.default)({}, trackStyle)) }),
_react2.default.createElement(
_Paper2.default,
{ style: thumbStyle, zDepth: 1, circle: true },
' ',
ripples,
' '
)
);
var elementsInOrder = labelPosition === 'right' ? _react2.default.createElement(
'div',
{ style: styles.controls },
switchOrThumbElement,
labelElement
) : _react2.default.createElement(
'div',
{ style: styles.controls },
labelElement,
switchOrThumbElement
);
return _react2.default.createElement(
'div',
{ ref: 'root', className: className, style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) },
_react2.default.createElement(_reactEventListener2.default, {
target: 'window',
onKeyDown: this.handleKeyDown,
onKeyUp: this.handleKeyUp
}),
inputElement,
elementsInOrder
);
}
}]);
return EnhancedSwitch;
}(_react.Component);
EnhancedSwitch.propTypes = {
checked: _react.PropTypes.bool,
className: _react.PropTypes.string,
defaultChecked: _react.PropTypes.bool,
disableFocusRipple: _react.PropTypes.bool,
disableTouchRipple: _react.PropTypes.bool,
disabled: _react.PropTypes.bool,
iconStyle: _react.PropTypes.object,
inputStyle: _react.PropTypes.object,
inputType: _react.PropTypes.string.isRequired,
label: _react.PropTypes.node,
labelPosition: _react.PropTypes.oneOf(['left', 'right']),
labelStyle: _react.PropTypes.object,
name: _react.PropTypes.string,
onBlur: _react.PropTypes.func,
onFocus: _react.PropTypes.func,
onMouseDown: _react.PropTypes.func,
onMouseLeave: _react.PropTypes.func,
onMouseUp: _react.PropTypes.func,
onParentShouldUpdate: _react.PropTypes.func,
onSwitch: _react.PropTypes.func,
onTouchEnd: _react.PropTypes.func,
onTouchStart: _react.PropTypes.func,
rippleColor: _react.PropTypes.string,
rippleStyle: _react.PropTypes.object,
style: _react.PropTypes.object,
switchElement: _react.PropTypes.element.isRequired,
switched: _react.PropTypes.bool.isRequired,
thumbStyle: _react.PropTypes.object,
trackStyle: _react.PropTypes.object,
value: _react.PropTypes.string
};
EnhancedSwitch.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = EnhancedSwitch;
/***/ },
/* 43 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactDom = __webpack_require__(4);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _shallowEqual = __webpack_require__(16);
var _shallowEqual2 = _interopRequireDefault(_shallowEqual);
var _autoPrefix = __webpack_require__(14);
var _autoPrefix2 = _interopRequireDefault(_autoPrefix);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _ScaleIn = __webpack_require__(190);
var _ScaleIn2 = _interopRequireDefault(_ScaleIn);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var pulsateDuration = 750;
var FocusRipple = function (_Component) {
_inherits(FocusRipple, _Component);
function FocusRipple() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, FocusRipple);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(FocusRipple)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.pulsate = function () {
var innerCircle = _reactDom2.default.findDOMNode(_this.refs.innerCircle);
if (!innerCircle) return;
var startScale = 'scale(1)';
var endScale = 'scale(0.85)';
var currentScale = innerCircle.style.transform || startScale;
var nextScale = currentScale === startScale ? endScale : startScale;
_autoPrefix2.default.set(innerCircle.style, 'transform', nextScale);
_this.timeout = setTimeout(_this.pulsate, pulsateDuration);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(FocusRipple, [{
key: 'componentDidMount',
value: function componentDidMount() {
if (this.props.show) {
this.setRippleSize();
this.pulsate();
}
}
}, {
key: 'shouldComponentUpdate',
value: function shouldComponentUpdate(nextProps, nextState) {
return !(0, _shallowEqual2.default)(this.props, nextProps) || !(0, _shallowEqual2.default)(this.state, nextState);
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
if (this.props.show) {
this.setRippleSize();
this.pulsate();
} else {
if (this.timeout) clearTimeout(this.timeout);
}
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
clearTimeout(this.timeout);
}
}, {
key: 'getRippleElement',
value: function getRippleElement(props) {
var color = props.color;
var innerStyle = props.innerStyle;
var opacity = props.opacity;
var _context$muiTheme = this.context.muiTheme;
var prepareStyles = _context$muiTheme.prepareStyles;
var ripple = _context$muiTheme.ripple;
var innerStyles = (0, _simpleAssign2.default)({
position: 'absolute',
height: '100%',
width: '100%',
borderRadius: '50%',
opacity: opacity ? opacity : 0.16,
backgroundColor: color || ripple.color,
transition: _transitions2.default.easeOut(pulsateDuration + 'ms', 'transform', null, _transitions2.default.easeInOutFunction)
}, innerStyle);
return _react2.default.createElement('div', { ref: 'innerCircle', style: prepareStyles((0, _simpleAssign2.default)({}, innerStyles)) });
}
}, {
key: 'setRippleSize',
value: function setRippleSize() {
var el = _reactDom2.default.findDOMNode(this.refs.innerCircle);
var height = el.offsetHeight;
var width = el.offsetWidth;
var size = Math.max(height, width);
var oldTop = 0;
// For browsers that don't support endsWith()
if (el.style.top.indexOf('px', el.style.top.length - 2) !== -1) {
oldTop = parseInt(el.style.top);
}
el.style.height = size + 'px';
el.style.top = height / 2 - size / 2 + oldTop + 'px';
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var show = _props.show;
var style = _props.style;
var mergedRootStyles = (0, _simpleAssign2.default)({
height: '100%',
width: '100%',
position: 'absolute',
top: 0,
left: 0
}, style);
var ripple = show ? this.getRippleElement(this.props) : null;
return _react2.default.createElement(
_ScaleIn2.default,
{
maxScale: 0.85,
style: mergedRootStyles
},
ripple
);
}
}]);
return FocusRipple;
}(_react.Component);
FocusRipple.propTypes = {
color: _react.PropTypes.string,
innerStyle: _react.PropTypes.object,
opacity: _react.PropTypes.number,
show: _react.PropTypes.bool,
style: _react.PropTypes.object
};
FocusRipple.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = FocusRipple;
/***/ },
/* 44 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactAddonsTransitionGroup = __webpack_require__(26);
var _reactAddonsTransitionGroup2 = _interopRequireDefault(_reactAddonsTransitionGroup);
var _SlideInChild = __webpack_require__(192);
var _SlideInChild2 = _interopRequireDefault(_SlideInChild);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var SlideIn = function (_Component) {
_inherits(SlideIn, _Component);
function SlideIn() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, SlideIn);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(SlideIn)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.getLeaveDirection = function () {
return _this.props.direction;
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(SlideIn, [{
key: 'render',
value: function render() {
var _this2 = this;
var _props = this.props;
var enterDelay = _props.enterDelay;
var children = _props.children;
var childStyle = _props.childStyle;
var direction = _props.direction;
var style = _props.style;
var other = _objectWithoutProperties(_props, ['enterDelay', 'children', 'childStyle', 'direction', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var mergedRootStyles = (0, _simpleAssign2.default)({}, {
position: 'relative',
overflow: 'hidden',
height: '100%'
}, style);
var newChildren = _react2.default.Children.map(children, function (child) {
return _react2.default.createElement(
_SlideInChild2.default,
{
key: child.key,
direction: direction,
enterDelay: enterDelay,
getLeaveDirection: _this2.getLeaveDirection,
style: childStyle
},
child
);
}, this);
return _react2.default.createElement(
_reactAddonsTransitionGroup2.default,
_extends({}, other, {
style: prepareStyles(mergedRootStyles),
component: 'div'
}),
newChildren
);
}
}]);
return SlideIn;
}(_react.Component);
SlideIn.propTypes = {
childStyle: _react.PropTypes.object,
children: _react.PropTypes.node,
direction: _react.PropTypes.oneOf(['left', 'right', 'up', 'down']),
enterDelay: _react.PropTypes.number,
style: _react.PropTypes.object
};
SlideIn.defaultProps = {
enterDelay: 0,
direction: 'left'
};
SlideIn.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = SlideIn;
/***/ },
/* 45 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = getMuiTheme;
var _lodash = __webpack_require__(92);
var _lodash2 = _interopRequireDefault(_lodash);
var _colorManipulator = __webpack_require__(12);
var _lightBaseTheme = __webpack_require__(84);
var _lightBaseTheme2 = _interopRequireDefault(_lightBaseTheme);
var _zIndex = __webpack_require__(86);
var _zIndex2 = _interopRequireDefault(_zIndex);
var _autoprefixer = __webpack_require__(211);
var _autoprefixer2 = _interopRequireDefault(_autoprefixer);
var _callOnce = __webpack_require__(212);
var _callOnce2 = _interopRequireDefault(_callOnce);
var _rtl = __webpack_require__(213);
var _rtl2 = _interopRequireDefault(_rtl);
var _compose = __webpack_require__(264);
var _compose2 = _interopRequireDefault(_compose);
var _typography = __webpack_require__(85);
var _typography2 = _interopRequireDefault(_typography);
var _colors = __webpack_require__(23);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
/**
* Get the MUI theme corresponding to a base theme.
* It's possible to override the computed theme values
* by providing a second argument. The calculated
* theme will be deeply merged with the second argument.
*/
function getMuiTheme(muiTheme) {
for (var _len = arguments.length, more = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
more[_key - 1] = arguments[_key];
}
muiTheme = _lodash2.default.apply(undefined, [{
zIndex: _zIndex2.default,
isRtl: false,
userAgent: undefined
}, _lightBaseTheme2.default, muiTheme].concat(more));
var _muiTheme = muiTheme;
var spacing = _muiTheme.spacing;
var fontFamily = _muiTheme.fontFamily;
var palette = _muiTheme.palette;
var baseTheme = { spacing: spacing, fontFamily: fontFamily, palette: palette };
muiTheme = (0, _lodash2.default)({
appBar: {
color: palette.primary1Color,
textColor: palette.alternateTextColor,
height: spacing.desktopKeylineIncrement,
titleFontWeight: _typography2.default.fontWeightNormal,
padding: spacing.desktopGutter
},
avatar: {
color: palette.canvasColor,
backgroundColor: (0, _colorManipulator.emphasize)(palette.canvasColor, 0.26),
borderColor: 'rgba(128, 128, 128, 0.15)'
},
badge: {
color: palette.alternateTextColor,
textColor: palette.textColor,
primaryColor: palette.accent1Color,
primaryTextColor: palette.alternateTextColor,
secondaryColor: palette.primary1Color,
secondaryTextColor: palette.alternateTextColor,
fontWeight: _typography2.default.fontWeightMedium
},
button: {
height: 36,
minWidth: 88,
iconButtonSize: spacing.iconSize * 2
},
card: {
titleColor: (0, _colorManipulator.fade)(palette.textColor, 0.87),
subtitleColor: (0, _colorManipulator.fade)(palette.textColor, 0.54),
fontWeight: _typography2.default.fontWeightMedium
},
cardMedia: {
color: _colors.darkWhite,
overlayContentBackground: _colors.lightBlack,
titleColor: _colors.darkWhite,
subtitleColor: _colors.lightWhite
},
cardText: {
textColor: palette.textColor
},
checkbox: {
boxColor: palette.textColor,
checkedColor: palette.primary1Color,
requiredColor: palette.primary1Color,
disabledColor: palette.disabledColor,
labelColor: palette.textColor,
labelDisabledColor: palette.disabledColor
},
chip: {
backgroundColor: (0, _colorManipulator.emphasize)(palette.canvasColor, 0.12),
deleteIconColor: (0, _colorManipulator.fade)(palette.textColor, 0.26),
textColor: (0, _colorManipulator.fade)(palette.textColor, 0.87),
fontSize: 14,
fontWeight: _typography2.default.fontWeightNormal,
shadow: '0 1px 6px ' + (0, _colorManipulator.fade)(palette.shadowColor, 0.12) + ',\n 0 1px 4px ' + (0, _colorManipulator.fade)(palette.shadowColor, 0.12)
},
datePicker: {
color: palette.primary1Color,
textColor: palette.alternateTextColor,
calendarTextColor: palette.textColor,
selectColor: palette.primary2Color,
selectTextColor: palette.alternateTextColor,
calendarYearBackgroundColor: _colors.white
},
dialog: {
titleFontSize: 22,
bodyFontSize: 16,
bodyColor: (0, _colorManipulator.fade)(palette.textColor, 0.6)
},
dropDownMenu: {
accentColor: palette.borderColor
},
enhancedButton: {
tapHighlightColor: _colors.transparent
},
flatButton: {
color: _colors.transparent,
buttonFilterColor: '#999999',
disabledTextColor: (0, _colorManipulator.fade)(palette.textColor, 0.3),
textColor: palette.textColor,
primaryTextColor: palette.primary1Color,
secondaryTextColor: palette.accent1Color,
fontSize: _typography2.default.fontStyleButtonFontSize,
fontWeight: _typography2.default.fontWeightMedium
},
floatingActionButton: {
buttonSize: 56,
miniSize: 40,
color: palette.primary1Color,
iconColor: palette.alternateTextColor,
secondaryColor: palette.accent1Color,
secondaryIconColor: palette.alternateTextColor,
disabledTextColor: palette.disabledColor,
disabledColor: (0, _colorManipulator.emphasize)(palette.canvasColor, 0.12)
},
gridTile: {
textColor: _colors.white
},
icon: {
color: palette.canvasColor,
backgroundColor: palette.primary1Color
},
inkBar: {
backgroundColor: palette.accent1Color
},
drawer: {
width: spacing.desktopKeylineIncrement * 4,
color: palette.canvasColor
},
listItem: {
nestedLevelDepth: 18,
secondaryTextColor: _colors.lightBlack,
leftIconColor: _colors.grey600,
rightIconColor: _colors.grey600
},
menu: {
backgroundColor: palette.canvasColor,
containerBackgroundColor: palette.canvasColor
},
menuItem: {
dataHeight: 32,
height: 48,
hoverColor: (0, _colorManipulator.fade)(palette.textColor, 0.035),
padding: spacing.desktopGutter,
selectedTextColor: palette.accent1Color,
rightIconDesktopFill: _colors.grey600
},
menuSubheader: {
padding: spacing.desktopGutter,
borderColor: palette.borderColor,
textColor: palette.primary1Color
},
overlay: {
backgroundColor: _colors.lightBlack
},
paper: {
color: palette.textColor,
backgroundColor: palette.canvasColor,
zDepthShadows: [[1, 6, 0.12, 1, 4, 0.12], [3, 10, 0.16, 3, 10, 0.23], [10, 30, 0.19, 6, 10, 0.23], [14, 45, 0.25, 10, 18, 0.22], [19, 60, 0.30, 15, 20, 0.22]].map(function (d) {
return '0 ' + d[0] + 'px ' + d[1] + 'px ' + (0, _colorManipulator.fade)(palette.shadowColor, d[2]) + ',\n 0 ' + d[3] + 'px ' + d[4] + 'px ' + (0, _colorManipulator.fade)(palette.shadowColor, d[5]);
})
},
radioButton: {
borderColor: palette.textColor,
backgroundColor: palette.alternateTextColor,
checkedColor: palette.primary1Color,
requiredColor: palette.primary1Color,
disabledColor: palette.disabledColor,
size: 24,
labelColor: palette.textColor,
labelDisabledColor: palette.disabledColor
},
raisedButton: {
color: palette.alternateTextColor,
textColor: palette.textColor,
primaryColor: palette.primary1Color,
primaryTextColor: palette.alternateTextColor,
secondaryColor: palette.accent1Color,
secondaryTextColor: palette.alternateTextColor,
disabledColor: (0, _colorManipulator.darken)(palette.alternateTextColor, 0.1),
disabledTextColor: (0, _colorManipulator.fade)(palette.textColor, 0.3),
fontSize: _typography2.default.fontStyleButtonFontSize,
fontWeight: _typography2.default.fontWeightMedium
},
refreshIndicator: {
strokeColor: palette.borderColor,
loadingStrokeColor: palette.primary1Color
},
ripple: {
color: (0, _colorManipulator.fade)(palette.textColor, 0.87)
},
slider: {
trackSize: 2,
trackColor: palette.primary3Color,
trackColorSelected: palette.accent3Color,
handleSize: 12,
handleSizeDisabled: 8,
handleSizeActive: 18,
handleColorZero: palette.primary3Color,
handleFillColor: palette.alternateTextColor,
selectionColor: palette.primary1Color,
rippleColor: palette.primary1Color
},
snackbar: {
textColor: palette.alternateTextColor,
backgroundColor: palette.textColor,
actionColor: palette.accent1Color
},
subheader: {
color: (0, _colorManipulator.fade)(palette.textColor, 0.54),
fontWeight: _typography2.default.fontWeightMedium
},
stepper: {
backgroundColor: 'transparent',
hoverBackgroundColor: (0, _colorManipulator.fade)(_colors.black, 0.06),
iconColor: palette.primary1Color,
hoveredIconColor: _colors.grey700,
inactiveIconColor: _colors.grey500,
textColor: (0, _colorManipulator.fade)(_colors.black, 0.87),
disabledTextColor: (0, _colorManipulator.fade)(_colors.black, 0.26),
connectorLineColor: _colors.grey400
},
table: {
backgroundColor: palette.canvasColor
},
tableFooter: {
borderColor: palette.borderColor,
textColor: palette.accent3Color
},
tableHeader: {
borderColor: palette.borderColor
},
tableHeaderColumn: {
textColor: palette.accent3Color,
height: 56,
spacing: 24
},
tableRow: {
hoverColor: palette.accent2Color,
stripeColor: (0, _colorManipulator.fade)((0, _colorManipulator.lighten)(palette.primary1Color, 0.5), 0.4),
selectedColor: palette.borderColor,
textColor: palette.textColor,
borderColor: palette.borderColor,
height: 48
},
tableRowColumn: {
height: 48,
spacing: 24
},
tabs: {
backgroundColor: palette.primary1Color,
textColor: (0, _colorManipulator.fade)(palette.alternateTextColor, 0.7),
selectedTextColor: palette.alternateTextColor
},
textField: {
textColor: palette.textColor,
hintColor: palette.disabledColor,
floatingLabelColor: palette.textColor,
disabledTextColor: palette.disabledColor,
errorColor: _colors.red500,
focusColor: palette.primary1Color,
backgroundColor: 'transparent',
borderColor: palette.borderColor
},
timePicker: {
color: palette.alternateTextColor,
textColor: palette.accent3Color,
accentColor: palette.primary1Color,
clockColor: palette.textColor,
clockCircleColor: palette.clockCircleColor,
headerColor: palette.pickerHeaderColor || palette.primary1Color,
selectColor: palette.primary2Color,
selectTextColor: palette.alternateTextColor
},
toggle: {
thumbOnColor: palette.primary1Color,
thumbOffColor: palette.accent2Color,
thumbDisabledColor: palette.borderColor,
thumbRequiredColor: palette.primary1Color,
trackOnColor: (0, _colorManipulator.fade)(palette.primary1Color, 0.5),
trackOffColor: palette.primary3Color,
trackDisabledColor: palette.primary3Color,
labelColor: palette.textColor,
labelDisabledColor: palette.disabledColor,
trackRequiredColor: (0, _colorManipulator.fade)(palette.primary1Color, 0.5)
},
toolbar: {
color: (0, _colorManipulator.fade)(palette.textColor, 0.54),
hoverColor: (0, _colorManipulator.fade)(palette.textColor, 0.87),
backgroundColor: (0, _colorManipulator.darken)(palette.accent2Color, 0.05),
height: 56,
titleFontSize: 20,
iconColor: (0, _colorManipulator.fade)(palette.textColor, 0.4),
separatorColor: (0, _colorManipulator.fade)(palette.textColor, 0.175),
menuHoverColor: (0, _colorManipulator.fade)(palette.textColor, 0.1)
},
tooltip: {
color: _colors.white,
rippleBackgroundColor: _colors.grey700
}
}, muiTheme, {
baseTheme: baseTheme, // To provide backward compatibility.
rawTheme: baseTheme });
// To provide backward compatibility.
var transformers = [_autoprefixer2.default, _rtl2.default, _callOnce2.default].map(function (t) {
return t(muiTheme);
}).filter(function (t) {
return t;
});
muiTheme.prepareStyles = _compose2.default.apply(undefined, _toConsumableArray(transformers));
return muiTheme;
}
/***/ },
/* 46 */
/***/ function(module, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = {
iconSize: 24,
desktopGutter: 24,
desktopGutterMore: 32,
desktopGutterLess: 16,
desktopGutterMini: 8,
desktopKeylineIncrement: 64,
desktopDropDownMenuItemHeight: 32,
desktopDropDownMenuFontSize: 15,
desktopDrawerMenuItemHeight: 48,
desktopSubheaderHeight: 48,
desktopToolbarHeight: 56
};
/***/ },
/* 47 */
/***/ function(module, exports) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = {
once: function once(el, type, callback) {
var typeArray = type ? type.split(' ') : [];
var recursiveFunction = function recursiveFunction(event) {
event.target.removeEventListener(event.type, recursiveFunction);
return callback(event);
};
for (var i = typeArray.length - 1; i >= 0; i--) {
this.on(el, typeArray[i], recursiveFunction);
}
},
on: function on(el, type, callback) {
if (el.addEventListener) {
el.addEventListener(type, callback);
} else {
// IE8+ Support
el.attachEvent('on' + type, function () {
callback.call(el);
});
}
},
off: function off(el, type, callback) {
if (el.removeEventListener) {
el.removeEventListener(type, callback);
} else {
// IE8+ Support
el.detachEvent('on' + type, callback);
}
},
isKeyboard: function isKeyboard(event) {
return ['keydown', 'keypress', 'keyup'].indexOf(event.type) !== -1;
}
};
/***/ },
/* 48 */
/***/ function(module, exports, __webpack_require__) {
/**
* Copyright 2014-2015, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
*/
'use strict';
var emptyFunction = __webpack_require__(88);
/**
* Similar to invariant but only logs a warning if the condition is not met.
* This can be used to log issues in development environments in critical
* paths. Removing the logging code for production environments will keep the
* same logic and follow the same code paths.
*/
var warning = emptyFunction;
if (true) {
warning = function warning(condition, format) {
for (var _len = arguments.length, args = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
args[_key - 2] = arguments[_key];
}
if (format === undefined) {
throw new Error('`warning(condition, format, ...args)` requires a warning ' + 'message argument');
}
if (format.indexOf('Failed Composite propType: ') === 0) {
return; // Ignore CompositeComponent proptype check.
}
if (!condition) {
var argIndex = 0;
var message = 'Warning: ' + format.replace(/%s/g, function () {
return args[argIndex++];
});
if (typeof console !== 'undefined') {
console.error(message);
}
try {
// --- Welcome to debugging React ---
// This error was thrown as a convenience so that you can use this stack
// to find the callsite that caused this warning to fire.
throw new Error(message);
} catch (x) {}
}
};
}
module.exports = warning;
/***/ },
/* 49 */
/***/ function(module, exports) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = function (value) {
if (Array.isArray(value)) value = value.join(',');
return value.match(/-webkit-|-moz-|-ms-/) !== null;
};
module.exports = exports['default'];
/***/ },
/* 50 */
/***/ function(module, exports, __webpack_require__) {
/**
* Copyright 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule EventConstants
*/
'use strict';
var keyMirror = __webpack_require__(216);
var PropagationPhases = keyMirror({ bubbled: null, captured: null });
/**
* Types of raw signals from the browser caught at the top level.
*/
var topLevelTypes = keyMirror({
topAbort: null,
topAnimationEnd: null,
topAnimationIteration: null,
topAnimationStart: null,
topBlur: null,
topCanPlay: null,
topCanPlayThrough: null,
topChange: null,
topClick: null,
topCompositionEnd: null,
topCompositionStart: null,
topCompositionUpdate: null,
topContextMenu: null,
topCopy: null,
topCut: null,
topDoubleClick: null,
topDrag: null,
topDragEnd: null,
topDragEnter: null,
topDragExit: null,
topDragLeave: null,
topDragOver: null,
topDragStart: null,
topDrop: null,
topDurationChange: null,
topEmptied: null,
topEncrypted: null,
topEnded: null,
topError: null,
topFocus: null,
topInput: null,
topInvalid: null,
topKeyDown: null,
topKeyPress: null,
topKeyUp: null,
topLoad: null,
topLoadedData: null,
topLoadedMetadata: null,
topLoadStart: null,
topMouseDown: null,
topMouseMove: null,
topMouseOut: null,
topMouseOver: null,
topMouseUp: null,
topPaste: null,
topPause: null,
topPlay: null,
topPlaying: null,
topProgress: null,
topRateChange: null,
topReset: null,
topScroll: null,
topSeeked: null,
topSeeking: null,
topSelectionChange: null,
topStalled: null,
topSubmit: null,
topSuspend: null,
topTextInput: null,
topTimeUpdate: null,
topTouchCancel: null,
topTouchEnd: null,
topTouchMove: null,
topTouchStart: null,
topTransitionEnd: null,
topVolumeChange: null,
topWaiting: null,
topWheel: null
});
var EventConstants = {
topLevelTypes: topLevelTypes,
PropagationPhases: PropagationPhases
};
module.exports = EventConstants;
/***/ },
/* 51 */
/***/ function(module, exports, __webpack_require__) {
/**
* Copyright 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule EventPluginUtils
*/
'use strict';
var _prodInvariant = __webpack_require__(25);
var EventConstants = __webpack_require__(50);
var ReactErrorUtils = __webpack_require__(94);
var invariant = __webpack_require__(19);
var warning = __webpack_require__(48);
/**
* Injected dependencies:
*/
/**
* - `ComponentTree`: [required] Module that can convert between React instances
* and actual node references.
*/
var ComponentTree;
var TreeTraversal;
var injection = {
injectComponentTree: function (Injected) {
ComponentTree = Injected;
if (true) {
true ? warning(Injected && Injected.getNodeFromInstance && Injected.getInstanceFromNode, 'EventPluginUtils.injection.injectComponentTree(...): Injected ' + 'module is missing getNodeFromInstance or getInstanceFromNode.') : void 0;
}
},
injectTreeTraversal: function (Injected) {
TreeTraversal = Injected;
if (true) {
true ? warning(Injected && Injected.isAncestor && Injected.getLowestCommonAncestor, 'EventPluginUtils.injection.injectTreeTraversal(...): Injected ' + 'module is missing isAncestor or getLowestCommonAncestor.') : void 0;
}
}
};
var topLevelTypes = EventConstants.topLevelTypes;
function isEndish(topLevelType) {
return topLevelType === topLevelTypes.topMouseUp || topLevelType === topLevelTypes.topTouchEnd || topLevelType === topLevelTypes.topTouchCancel;
}
function isMoveish(topLevelType) {
return topLevelType === topLevelTypes.topMouseMove || topLevelType === topLevelTypes.topTouchMove;
}
function isStartish(topLevelType) {
return topLevelType === topLevelTypes.topMouseDown || topLevelType === topLevelTypes.topTouchStart;
}
var validateEventDispatches;
if (true) {
validateEventDispatches = function (event) {
var dispatchListeners = event._dispatchListeners;
var dispatchInstances = event._dispatchInstances;
var listenersIsArr = Array.isArray(dispatchListeners);
var listenersLen = listenersIsArr ? dispatchListeners.length : dispatchListeners ? 1 : 0;
var instancesIsArr = Array.isArray(dispatchInstances);
var instancesLen = instancesIsArr ? dispatchInstances.length : dispatchInstances ? 1 : 0;
true ? warning(instancesIsArr === listenersIsArr && instancesLen === listenersLen, 'EventPluginUtils: Invalid `event`.') : void 0;
};
}
/**
* Dispatch the event to the listener.
* @param {SyntheticEvent} event SyntheticEvent to handle
* @param {boolean} simulated If the event is simulated (changes exn behavior)
* @param {function} listener Application-level callback
* @param {*} inst Internal component instance
*/
function executeDispatch(event, simulated, listener, inst) {
var type = event.type || 'unknown-event';
event.currentTarget = EventPluginUtils.getNodeFromInstance(inst);
if (simulated) {
ReactErrorUtils.invokeGuardedCallbackWithCatch(type, listener, event);
} else {
ReactErrorUtils.invokeGuardedCallback(type, listener, event);
}
event.currentTarget = null;
}
/**
* Standard/simple iteration through an event's collected dispatches.
*/
function executeDispatchesInOrder(event, simulated) {
var dispatchListeners = event._dispatchListeners;
var dispatchInstances = event._dispatchInstances;
if (true) {
validateEventDispatches(event);
}
if (Array.isArray(dispatchListeners)) {
for (var i = 0; i < dispatchListeners.length; i++) {
if (event.isPropagationStopped()) {
break;
}
// Listeners and Instances are two parallel arrays that are always in sync.
executeDispatch(event, simulated, dispatchListeners[i], dispatchInstances[i]);
}
} else if (dispatchListeners) {
executeDispatch(event, simulated, dispatchListeners, dispatchInstances);
}
event._dispatchListeners = null;
event._dispatchInstances = null;
}
/**
* Standard/simple iteration through an event's collected dispatches, but stops
* at the first dispatch execution returning true, and returns that id.
*
* @return {?string} id of the first dispatch execution who's listener returns
* true, or null if no listener returned true.
*/
function executeDispatchesInOrderStopAtTrueImpl(event) {
var dispatchListeners = event._dispatchListeners;
var dispatchInstances = event._dispatchInstances;
if (true) {
validateEventDispatches(event);
}
if (Array.isArray(dispatchListeners)) {
for (var i = 0; i < dispatchListeners.length; i++) {
if (event.isPropagationStopped()) {
break;
}
// Listeners and Instances are two parallel arrays that are always in sync.
if (dispatchListeners[i](event, dispatchInstances[i])) {
return dispatchInstances[i];
}
}
} else if (dispatchListeners) {
if (dispatchListeners(event, dispatchInstances)) {
return dispatchInstances;
}
}
return null;
}
/**
* @see executeDispatchesInOrderStopAtTrueImpl
*/
function executeDispatchesInOrderStopAtTrue(event) {
var ret = executeDispatchesInOrderStopAtTrueImpl(event);
event._dispatchInstances = null;
event._dispatchListeners = null;
return ret;
}
/**
* Execution of a "direct" dispatch - there must be at most one dispatch
* accumulated on the event or it is considered an error. It doesn't really make
* sense for an event with multiple dispatches (bubbled) to keep track of the
* return values at each dispatch execution, but it does tend to make sense when
* dealing with "direct" dispatches.
*
* @return {*} The return value of executing the single dispatch.
*/
function executeDirectDispatch(event) {
if (true) {
validateEventDispatches(event);
}
var dispatchListener = event._dispatchListeners;
var dispatchInstance = event._dispatchInstances;
!!Array.isArray(dispatchListener) ? true ? invariant(false, 'executeDirectDispatch(...): Invalid `event`.') : _prodInvariant('103') : void 0;
event.currentTarget = dispatchListener ? EventPluginUtils.getNodeFromInstance(dispatchInstance) : null;
var res = dispatchListener ? dispatchListener(event) : null;
event.currentTarget = null;
event._dispatchListeners = null;
event._dispatchInstances = null;
return res;
}
/**
* @param {SyntheticEvent} event
* @return {boolean} True iff number of dispatches accumulated is greater than 0.
*/
function hasDispatches(event) {
return !!event._dispatchListeners;
}
/**
* General utilities that are useful in creating custom Event Plugins.
*/
var EventPluginUtils = {
isEndish: isEndish,
isMoveish: isMoveish,
isStartish: isStartish,
executeDirectDispatch: executeDirectDispatch,
executeDispatchesInOrder: executeDispatchesInOrder,
executeDispatchesInOrderStopAtTrue: executeDispatchesInOrderStopAtTrue,
hasDispatches: hasDispatches,
getInstanceFromNode: function (node) {
return ComponentTree.getInstanceFromNode(node);
},
getNodeFromInstance: function (node) {
return ComponentTree.getNodeFromInstance(node);
},
isAncestor: function (a, b) {
return TreeTraversal.isAncestor(a, b);
},
getLowestCommonAncestor: function (a, b) {
return TreeTraversal.getLowestCommonAncestor(a, b);
},
getParentInstance: function (inst) {
return TreeTraversal.getParentInstance(inst);
},
traverseTwoPhase: function (target, fn, arg) {
return TreeTraversal.traverseTwoPhase(target, fn, arg);
},
traverseEnterLeave: function (from, to, fn, argFrom, argTo) {
return TreeTraversal.traverseEnterLeave(from, to, fn, argFrom, argTo);
},
injection: injection
};
module.exports = EventPluginUtils;
/***/ },
/* 52 */
/***/ function(module, exports) {
module.exports = function(module) {
if(!module.webpackPolyfill) {
module.deprecate = function() {};
module.paths = [];
// module.parent = undefined by default
module.children = [];
module.webpackPolyfill = 1;
}
return module;
}
/***/ },
/* 53 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _Avatar = __webpack_require__(102);
var _Avatar2 = _interopRequireDefault(_Avatar);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _Avatar2.default;
/***/ },
/* 54 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles() {
return {
root: {
padding: 8,
position: 'relative'
},
action: {
marginRight: 8
}
};
}
var CardActions = function (_Component) {
_inherits(CardActions, _Component);
function CardActions() {
_classCallCheck(this, CardActions);
return _possibleConstructorReturn(this, Object.getPrototypeOf(CardActions).apply(this, arguments));
}
_createClass(CardActions, [{
key: 'render',
value: function render() {
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var children = _react2.default.Children.map(this.props.children, function (child) {
if (_react2.default.isValidElement(child)) {
return _react2.default.cloneElement(child, {
style: (0, _simpleAssign2.default)({}, styles.action, child.props.style)
});
}
});
return _react2.default.createElement(
'div',
_extends({}, this.props, { style: prepareStyles((0, _simpleAssign2.default)(styles.root, this.props.style)) }),
children
);
}
}]);
return CardActions;
}(_react.Component);
CardActions.propTypes = {
/**
* If true, a click on this card component expands the card.
*/
actAsExpander: _react.PropTypes.bool,
/**
* Can be used to render elements inside the Card Action.
*/
children: _react.PropTypes.node,
/**
* If true, this card component is expandable.
*/
expandable: _react.PropTypes.bool,
/**
* If true, this card component will include a button to expand the card.
*/
showExpandableButton: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
CardActions.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = CardActions;
/***/ },
/* 55 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _keyboardArrowUp = __webpack_require__(199);
var _keyboardArrowUp2 = _interopRequireDefault(_keyboardArrowUp);
var _keyboardArrowDown = __webpack_require__(198);
var _keyboardArrowDown2 = _interopRequireDefault(_keyboardArrowDown);
var _IconButton = __webpack_require__(20);
var _IconButton2 = _interopRequireDefault(_IconButton);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles() {
return {
root: {
top: 0,
bottom: 0,
right: 4,
margin: 'auto',
position: 'absolute'
}
};
}
var CardExpandable = function (_Component) {
_inherits(CardExpandable, _Component);
function CardExpandable() {
_classCallCheck(this, CardExpandable);
return _possibleConstructorReturn(this, Object.getPrototypeOf(CardExpandable).apply(this, arguments));
}
_createClass(CardExpandable, [{
key: 'render',
value: function render() {
var styles = getStyles(this.props, this.context);
return _react2.default.createElement(
_IconButton2.default,
{
style: (0, _simpleAssign2.default)(styles.root, this.props.style),
onTouchTap: this.props.onExpanding
},
this.props.expanded ? _react2.default.createElement(_keyboardArrowUp2.default, null) : _react2.default.createElement(_keyboardArrowDown2.default, null)
);
}
}]);
return CardExpandable;
}(_react.Component);
CardExpandable.propTypes = {
expanded: _react.PropTypes.bool,
onExpanding: _react.PropTypes.func.isRequired,
style: _react.PropTypes.object
};
CardExpandable.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = CardExpandable;
/***/ },
/* 56 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _Avatar = __webpack_require__(53);
var _Avatar2 = _interopRequireDefault(_Avatar);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var card = context.muiTheme.card;
return {
root: {
padding: 16,
fontWeight: card.fontWeight,
boxSizing: 'border-box',
position: 'relative',
whiteSpace: 'nowrap'
},
text: {
display: 'inline-block',
verticalAlign: 'top',
whiteSpace: 'normal',
paddingRight: '90px'
},
avatar: {
marginRight: 16
},
title: {
color: props.titleColor || card.titleColor,
display: 'block',
fontSize: 15
},
subtitle: {
color: props.subtitleColor || card.subtitleColor,
display: 'block',
fontSize: 14
}
};
}
var CardHeader = function (_Component) {
_inherits(CardHeader, _Component);
function CardHeader() {
_classCallCheck(this, CardHeader);
return _possibleConstructorReturn(this, Object.getPrototypeOf(CardHeader).apply(this, arguments));
}
_createClass(CardHeader, [{
key: 'render',
value: function render() {
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var rootStyle = (0, _simpleAssign2.default)(styles.root, this.props.style);
var textStyle = (0, _simpleAssign2.default)(styles.text, this.props.textStyle);
var titleStyle = (0, _simpleAssign2.default)(styles.title, this.props.titleStyle);
var subtitleStyle = (0, _simpleAssign2.default)(styles.subtitle, this.props.subtitleStyle);
var avatar = this.props.avatar;
if (_react2.default.isValidElement(this.props.avatar)) {
avatar = _react2.default.cloneElement(avatar, {
style: (0, _simpleAssign2.default)(styles.avatar, avatar.props.style)
});
} else if (avatar !== null) {
avatar = _react2.default.createElement(_Avatar2.default, { src: this.props.avatar, style: styles.avatar });
}
var _props = this.props;
var title = _props.title;
var subtitle = _props.subtitle;
var other = _objectWithoutProperties(_props, ['title', 'subtitle']);
return _react2.default.createElement(
'div',
_extends({}, other, { style: prepareStyles(rootStyle) }),
avatar,
_react2.default.createElement(
'div',
{ style: prepareStyles(textStyle) },
_react2.default.createElement(
'span',
{ style: prepareStyles(titleStyle) },
title
),
_react2.default.createElement(
'span',
{ style: prepareStyles(subtitleStyle) },
subtitle
)
),
this.props.children
);
}
}]);
return CardHeader;
}(_react.Component);
CardHeader.muiName = 'CardHeader';
CardHeader.propTypes = {
/**
* If true, a click on this card component expands the card.
*/
actAsExpander: _react.PropTypes.bool,
/**
* This is the [Avatar](/#/components/avatar) element to be displayed on the Card Header.
* If `avatar` is an `Avatar` or other element, it will be rendered.
* If `avatar` is a string, it will be used as the image `src` for an `Avatar`.
*/
avatar: _react.PropTypes.node,
/**
* Can be used to render elements inside the Card Header.
*/
children: _react.PropTypes.node,
/**
* If true, this card component is expandable.
*/
expandable: _react.PropTypes.bool,
/**
* If true, this card component will include a button to expand the card.
*/
showExpandableButton: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* Can be used to render a subtitle in Card Header.
*/
subtitle: _react.PropTypes.node,
/**
* Override the subtitle color.
*/
subtitleColor: _react.PropTypes.string,
/**
* Override the inline-styles of the subtitle.
*/
subtitleStyle: _react.PropTypes.object,
/**
* Override the inline-styles of the text.
*/
textStyle: _react.PropTypes.object,
/**
* Can be used to render a title in Card Header.
*/
title: _react.PropTypes.node,
/**
* Override the title color.
*/
titleColor: _react.PropTypes.string,
/**
* Override the inline-styles of the title.
*/
titleStyle: _react.PropTypes.object
};
CardHeader.defaultProps = {
avatar: null
};
CardHeader.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = CardHeader;
/***/ },
/* 57 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var cardMedia = context.muiTheme.cardMedia;
return {
root: {
position: 'relative'
},
overlayContainer: {
position: 'absolute',
top: 0,
bottom: 0,
right: 0,
left: 0
},
overlay: {
height: '100%',
position: 'relative'
},
overlayContent: {
position: 'absolute',
bottom: 0,
right: 0,
left: 0,
paddingTop: 8,
background: cardMedia.overlayContentBackground
},
media: {},
mediaChild: {
verticalAlign: 'top',
maxWidth: '100%',
minWidth: '100%',
width: '100%'
}
};
}
var CardMedia = function (_Component) {
_inherits(CardMedia, _Component);
function CardMedia() {
_classCallCheck(this, CardMedia);
return _possibleConstructorReturn(this, Object.getPrototypeOf(CardMedia).apply(this, arguments));
}
_createClass(CardMedia, [{
key: 'render',
value: function render() {
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var rootStyle = (0, _simpleAssign2.default)(styles.root, this.props.style);
var mediaStyle = (0, _simpleAssign2.default)(styles.media, this.props.mediaStyle);
var overlayContainerStyle = (0, _simpleAssign2.default)(styles.overlayContainer, this.props.overlayContainerStyle);
var overlayContentStyle = (0, _simpleAssign2.default)(styles.overlayContent, this.props.overlayContentStyle);
var overlayStyle = (0, _simpleAssign2.default)(styles.overlay, this.props.overlayStyle);
var titleColor = this.context.muiTheme.cardMedia.titleColor;
var subtitleColor = this.context.muiTheme.cardMedia.subtitleColor;
var color = this.context.muiTheme.cardMedia.color;
var children = _react2.default.Children.map(this.props.children, function (child) {
return _react2.default.cloneElement(child, {
style: prepareStyles((0, _simpleAssign2.default)({}, styles.mediaChild, child.props.style))
});
});
var overlayChildren = _react2.default.Children.map(this.props.overlay, function (child) {
if (child.type.muiName === 'CardHeader' || child.type.muiName === 'CardTitle') {
return _react2.default.cloneElement(child, {
titleColor: titleColor,
subtitleColor: subtitleColor
});
} else if (child.type.muiName === 'CardText') {
return _react2.default.cloneElement(child, {
color: color
});
} else {
return child;
}
});
return _react2.default.createElement(
'div',
_extends({}, this.props, { style: prepareStyles(rootStyle) }),
_react2.default.createElement(
'div',
{ style: prepareStyles(mediaStyle) },
children
),
this.props.overlay ? _react2.default.createElement(
'div',
{ style: prepareStyles(overlayContainerStyle) },
_react2.default.createElement(
'div',
{ style: prepareStyles(overlayStyle) },
_react2.default.createElement(
'div',
{ style: prepareStyles(overlayContentStyle) },
overlayChildren
)
)
) : ''
);
}
}]);
return CardMedia;
}(_react.Component);
CardMedia.propTypes = {
/**
* If true, a click on this card component expands the card.
*/
actAsExpander: _react.PropTypes.bool,
/**
* Can be used to render elements inside the Card Media.
*/
children: _react.PropTypes.node,
/**
* If true, this card component is expandable.
*/
expandable: _react.PropTypes.bool,
/**
* Override the inline-styles of the Card Media.
*/
mediaStyle: _react.PropTypes.object,
/**
* Can be used to render overlay element in Card Media.
*/
overlay: _react.PropTypes.node,
/**
* Override the inline-styles of the overlay container.
*/
overlayContainerStyle: _react.PropTypes.object,
/**
* Override the inline-styles of the overlay content.
*/
overlayContentStyle: _react.PropTypes.object,
/**
* Override the inline-styles of the overlay element.
*/
overlayStyle: _react.PropTypes.object,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
CardMedia.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = CardMedia;
/***/ },
/* 58 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var cardText = context.muiTheme.cardText;
return {
root: {
padding: 16,
fontSize: 14,
color: props.color || cardText.textColor
}
};
}
var CardText = function (_Component) {
_inherits(CardText, _Component);
function CardText() {
_classCallCheck(this, CardText);
return _possibleConstructorReturn(this, Object.getPrototypeOf(CardText).apply(this, arguments));
}
_createClass(CardText, [{
key: 'render',
value: function render() {
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var rootStyle = (0, _simpleAssign2.default)(styles.root, this.props.style);
return _react2.default.createElement(
'div',
_extends({}, this.props, { style: prepareStyles(rootStyle) }),
this.props.children
);
}
}]);
return CardText;
}(_react.Component);
CardText.muiName = 'CardText';
CardText.propTypes = {
/**
* If true, a click on this card component expands the card.
*/
actAsExpander: _react.PropTypes.bool,
/**
* Can be used to render elements inside the Card Text.
*/
children: _react.PropTypes.node,
/**
* Override the CardText color.
*/
color: _react.PropTypes.string,
/**
* If true, this card component is expandable.
*/
expandable: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
CardText.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = CardText;
/***/ },
/* 59 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var card = context.muiTheme.card;
return {
root: {
padding: 16,
position: 'relative'
},
title: {
fontSize: 24,
color: props.titleColor || card.titleColor,
display: 'block',
lineHeight: '36px'
},
subtitle: {
fontSize: 14,
color: props.subtitleColor || card.subtitleColor,
display: 'block'
}
};
}
var CardTitle = function (_Component) {
_inherits(CardTitle, _Component);
function CardTitle() {
_classCallCheck(this, CardTitle);
return _possibleConstructorReturn(this, Object.getPrototypeOf(CardTitle).apply(this, arguments));
}
_createClass(CardTitle, [{
key: 'render',
value: function render() {
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var rootStyle = (0, _simpleAssign2.default)({}, styles.root, this.props.style);
var titleStyle = (0, _simpleAssign2.default)({}, styles.title, this.props.titleStyle);
var subtitleStyle = (0, _simpleAssign2.default)({}, styles.subtitle, this.props.subtitleStyle);
var _props = this.props;
var title = _props.title;
var subtitle = _props.subtitle;
var other = _objectWithoutProperties(_props, ['title', 'subtitle']);
return _react2.default.createElement(
'div',
_extends({}, other, { style: prepareStyles(rootStyle) }),
_react2.default.createElement(
'span',
{ style: prepareStyles(titleStyle) },
title
),
_react2.default.createElement(
'span',
{ style: prepareStyles(subtitleStyle) },
subtitle
),
this.props.children
);
}
}]);
return CardTitle;
}(_react.Component);
CardTitle.muiName = 'CardTitle';
CardTitle.propTypes = {
/**
* If true, a click on this card component expands the card.
*/
actAsExpander: _react.PropTypes.bool,
/**
* Can be used to render elements inside the Card Title.
*/
children: _react.PropTypes.node,
/**
* If true, this card component is expandable.
*/
expandable: _react.PropTypes.bool,
/**
* If true, this card component will include a button to expand the card.
*/
showExpandableButton: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* Can be used to render a subtitle in the Card Title.
*/
subtitle: _react.PropTypes.node,
/**
* Override the subtitle color.
*/
subtitleColor: _react.PropTypes.string,
/**
* Override the inline-styles of the subtitle.
*/
subtitleStyle: _react.PropTypes.object,
/**
* Can be used to render a title in the Card Title.
*/
title: _react.PropTypes.node,
/**
* Override the title color.
*/
titleColor: _react.PropTypes.string,
/**
* Override the inline-styles of the title.
*/
titleStyle: _react.PropTypes.object
};
CardTitle.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = CardTitle;
/***/ },
/* 60 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _Divider = __webpack_require__(122);
var _Divider2 = _interopRequireDefault(_Divider);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _Divider2.default;
/***/ },
/* 61 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.MenuItem = exports.DropDownMenu = undefined;
var _DropDownMenu2 = __webpack_require__(125);
var _DropDownMenu3 = _interopRequireDefault(_DropDownMenu2);
var _MenuItem2 = __webpack_require__(37);
var _MenuItem3 = _interopRequireDefault(_MenuItem2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.DropDownMenu = _DropDownMenu3.default;
exports.MenuItem = _MenuItem3.default;
exports.default = _DropDownMenu3.default;
/***/ },
/* 62 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function getStyles(props, context) {
var _titleBar;
var _context$muiTheme = context.muiTheme;
var baseTheme = _context$muiTheme.baseTheme;
var gridTile = _context$muiTheme.gridTile;
var actionPos = props.actionIcon && props.actionPosition;
var styles = {
root: {
position: 'relative',
display: 'block',
height: '100%',
overflow: 'hidden'
},
titleBar: (_titleBar = {
position: 'absolute',
left: 0,
right: 0
}, _defineProperty(_titleBar, props.titlePosition, 0), _defineProperty(_titleBar, 'height', props.subtitle ? 68 : 48), _defineProperty(_titleBar, 'background', props.titleBackground), _defineProperty(_titleBar, 'display', 'flex'), _defineProperty(_titleBar, 'alignItems', 'center'), _titleBar),
titleWrap: {
flexGrow: 1,
marginLeft: actionPos !== 'left' ? baseTheme.spacing.desktopGutterLess : 0,
marginRight: actionPos === 'left' ? baseTheme.spacing.desktopGutterLess : 0,
color: gridTile.textColor,
overflow: 'hidden'
},
title: {
fontSize: '16px',
textOverflow: 'ellipsis',
overflow: 'hidden',
whiteSpace: 'nowrap'
},
subtitle: {
fontSize: '12px',
textOverflow: 'ellipsis',
overflow: 'hidden',
whiteSpace: 'nowrap'
},
actionIcon: {
order: actionPos === 'left' ? -1 : 1
},
childImg: {
height: '100%',
transform: 'translateX(-50%)',
position: 'relative',
left: '50%'
}
};
return styles;
}
var GridTile = function (_Component) {
_inherits(GridTile, _Component);
function GridTile() {
_classCallCheck(this, GridTile);
return _possibleConstructorReturn(this, Object.getPrototypeOf(GridTile).apply(this, arguments));
}
_createClass(GridTile, [{
key: 'componentDidMount',
value: function componentDidMount() {
this.ensureImageCover();
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
this.ensureImageCover();
}
}, {
key: 'ensureImageCover',
value: function ensureImageCover() {
var imgEl = this.refs.img;
if (imgEl) {
(function () {
var fit = function fit() {
if (imgEl.offsetWidth < imgEl.parentNode.offsetWidth) {
imgEl.style.height = 'auto';
imgEl.style.left = '0';
imgEl.style.width = '100%';
imgEl.style.top = '50%';
imgEl.style.transform = imgEl.style.WebkitTransform = 'translateY(-50%)';
}
imgEl.removeEventListener('load', fit);
imgEl = null; // prevent closure memory leak
};
if (imgEl.complete) {
fit();
} else {
imgEl.addEventListener('load', fit);
}
})();
}
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var title = _props.title;
var subtitle = _props.subtitle;
var titlePosition = _props.titlePosition;
var // eslint-disable-line no-unused-vars
titleBackground = _props.titleBackground;
var // eslint-disable-line no-unused-vars
actionIcon = _props.actionIcon;
var // eslint-disable-line no-unused-vars
actionPosition = _props.actionPosition;
var // eslint-disable-line no-unused-vars
style = _props.style;
var children = _props.children;
var containerElement = _props.containerElement;
var other = _objectWithoutProperties(_props, ['title', 'subtitle', 'titlePosition', 'titleBackground', 'actionIcon', 'actionPosition', 'style', 'children', 'containerElement']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var mergedRootStyles = (0, _simpleAssign2.default)(styles.root, style);
var titleBar = null;
if (title) {
titleBar = _react2.default.createElement(
'div',
{ key: 'titlebar', style: prepareStyles(styles.titleBar) },
_react2.default.createElement(
'div',
{ style: prepareStyles(styles.titleWrap) },
_react2.default.createElement(
'div',
{ style: prepareStyles(styles.title) },
title
),
subtitle ? _react2.default.createElement(
'div',
{ style: prepareStyles(styles.subtitle) },
subtitle
) : null
),
actionIcon ? _react2.default.createElement(
'div',
{ style: prepareStyles(styles.actionIcon) },
actionIcon
) : null
);
}
var newChildren = children;
// if there is a single image passed as children
// clone it and add our styles
if (_react2.default.Children.count(children) === 1) {
newChildren = _react2.default.Children.map(children, function (child) {
if (child.type === 'img') {
return _react2.default.cloneElement(child, {
key: 'img',
ref: 'img',
style: prepareStyles((0, _simpleAssign2.default)({}, styles.childImg, child.props.style))
});
} else {
return child;
}
});
}
var containerProps = _extends({
style: prepareStyles(mergedRootStyles)
}, other);
return _react2.default.isValidElement(containerElement) ? _react2.default.cloneElement(containerElement, containerProps, [newChildren, titleBar]) : _react2.default.createElement(containerElement, containerProps, [newChildren, titleBar]);
}
}]);
return GridTile;
}(_react.Component);
GridTile.propTypes = {
/**
* An IconButton element to be used as secondary action target
* (primary action target is the tile itself).
*/
actionIcon: _react.PropTypes.element,
/**
* Position of secondary action IconButton.
*/
actionPosition: _react.PropTypes.oneOf(['left', 'right']),
/**
* Theoretically you can pass any node as children, but the main use case is to pass an img,
* in whichcase GridTile takes care of making the image "cover" available space
* (similar to background-size: cover or to object-fit:cover).
*/
children: _react.PropTypes.node,
/**
* Width of the tile in number of grid cells.
*/
cols: _react.PropTypes.number,
/**
* Either a string used as tag name for the tile root element, or a ReactElement.
* This is useful when you have, for example, a custom implementation of
* a navigation link (that knows about your routes) and you want to use it as the primary tile action.
* In case you pass a ReactElement, please ensure that it passes all props,
* accepts styles overrides and render it's children.
*/
containerElement: _react.PropTypes.oneOfType([_react.PropTypes.string, _react.PropTypes.element]),
/**
* Height of the tile in number of grid cells.
*/
rows: _react.PropTypes.number,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* String or element serving as subtitle (support text).
*/
subtitle: _react.PropTypes.node,
/**
* Title to be displayed on tile.
*/
title: _react.PropTypes.node,
/**
* Style used for title bar background.
* Useful for setting custom gradients for example
*/
titleBackground: _react.PropTypes.string,
/**
* Position of the title bar (container of title, subtitle and action icon).
*/
titlePosition: _react.PropTypes.oneOf(['top', 'bottom'])
};
GridTile.defaultProps = {
titlePosition: 'bottom',
titleBackground: 'rgba(0, 0, 0, 0.4)',
actionPosition: 'right',
cols: 1,
rows: 1,
containerElement: 'div'
};
GridTile.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = GridTile;
/***/ },
/* 63 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.MakeSelectable = undefined;
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _colorManipulator = __webpack_require__(12);
var _deprecatedPropType = __webpack_require__(15);
var _deprecatedPropType2 = _interopRequireDefault(_deprecatedPropType);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var MakeSelectable = exports.MakeSelectable = function MakeSelectable(Component) {
var _class, _temp2;
return _temp2 = _class = function (_Component) {
_inherits(_class, _Component);
function _class() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, _class);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(_class)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.hasSelectedDescendant = function (previousValue, child) {
if (_react2.default.isValidElement(child) && child.props.nestedItems && child.props.nestedItems.length > 0) {
return child.props.nestedItems.reduce(_this.hasSelectedDescendant, previousValue);
}
return previousValue || _this.isChildSelected(child, _this.props);
}, _this.handleItemTouchTap = function (event, item) {
var valueLink = _this.getValueLink(_this.props);
var itemValue = item.props.value;
if (itemValue !== valueLink.value) {
valueLink.requestChange(event, itemValue);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(_class, [{
key: 'getValueLink',
value: function getValueLink(props) {
return props.valueLink || {
value: props.value,
requestChange: props.onChange
};
}
}, {
key: 'extendChild',
value: function extendChild(child, styles, selectedItemStyle) {
var _this2 = this;
if (child && child.type && child.type.muiName === 'ListItem') {
var selected = this.isChildSelected(child, this.props);
var selectedChildrenStyles = void 0;
if (selected) {
selectedChildrenStyles = (0, _simpleAssign2.default)({}, styles, selectedItemStyle);
}
var mergedChildrenStyles = (0, _simpleAssign2.default)({}, child.props.style, selectedChildrenStyles);
this.keyIndex += 1;
return _react2.default.cloneElement(child, {
onTouchTap: function onTouchTap(event) {
_this2.handleItemTouchTap(event, child);
if (child.props.onTouchTap) {
child.props.onTouchTap(event);
}
},
key: this.keyIndex,
style: mergedChildrenStyles,
nestedItems: child.props.nestedItems.map(function (child) {
return _this2.extendChild(child, styles, selectedItemStyle);
}),
initiallyOpen: this.isInitiallyOpen(child)
});
} else {
return child;
}
}
}, {
key: 'isInitiallyOpen',
value: function isInitiallyOpen(child) {
if (child.props.initiallyOpen) {
return child.props.initiallyOpen;
}
return this.hasSelectedDescendant(false, child);
}
}, {
key: 'isChildSelected',
value: function isChildSelected(child, props) {
return this.getValueLink(props).value === child.props.value;
}
}, {
key: 'render',
value: function render() {
var _this3 = this;
var _props = this.props;
var children = _props.children;
var selectedItemStyle = _props.selectedItemStyle;
this.keyIndex = 0;
var styles = {};
if (!selectedItemStyle) {
var textColor = this.context.muiTheme.baseTheme.palette.textColor;
styles.backgroundColor = (0, _colorManipulator.fade)(textColor, 0.2);
}
return _react2.default.createElement(
Component,
_extends({}, this.props, this.state),
_react2.default.Children.map(children, function (child) {
return _this3.extendChild(child, styles, selectedItemStyle);
})
);
}
}]);
return _class;
}(Component), _class.propTypes = {
children: _react.PropTypes.node,
onChange: _react.PropTypes.func,
selectedItemStyle: _react.PropTypes.object,
value: _react.PropTypes.any,
valueLink: (0, _deprecatedPropType2.default)(_react.PropTypes.shape({
value: _react.PropTypes.any,
requestChange: _react.PropTypes.func
}), 'This property is deprecated due to his low popularity. Use the value and onChange property.')
}, _class.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
}, _temp2;
};
exports.default = MakeSelectable;
/***/ },
/* 64 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.MenuItem = exports.Menu = undefined;
var _Menu2 = __webpack_require__(28);
var _Menu3 = _interopRequireDefault(_Menu2);
var _MenuItem2 = __webpack_require__(38);
var _MenuItem3 = _interopRequireDefault(_MenuItem2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.Menu = _Menu3.default;
exports.MenuItem = _MenuItem3.default;
exports.default = _Menu3.default;
/***/ },
/* 65 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _RadioButton = __webpack_require__(66);
var _RadioButton2 = _interopRequireDefault(_RadioButton);
var _warning = __webpack_require__(6);
var _warning2 = _interopRequireDefault(_warning);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var RadioButtonGroup = function (_Component) {
_inherits(RadioButtonGroup, _Component);
function RadioButtonGroup() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, RadioButtonGroup);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(RadioButtonGroup)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
numberCheckedRadioButtons: 0,
selected: _this.props.valueSelected || _this.props.defaultSelected || ''
}, _this.handleChange = function (event, newSelection) {
_this.updateRadioButtons(newSelection);
// Successful update
if (_this.state.numberCheckedRadioButtons === 0) {
if (_this.props.onChange) _this.props.onChange(event, newSelection);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(RadioButtonGroup, [{
key: 'componentWillMount',
value: function componentWillMount() {
var _this2 = this;
var cnt = 0;
_react2.default.Children.forEach(this.props.children, function (option) {
if (_this2.hasCheckAttribute(option)) cnt++;
}, this);
this.setState({ numberCheckedRadioButtons: cnt });
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (nextProps.hasOwnProperty('valueSelected')) {
this.setState({
selected: nextProps.valueSelected
});
}
}
}, {
key: 'hasCheckAttribute',
value: function hasCheckAttribute(radioButton) {
return radioButton.props.hasOwnProperty('checked') && radioButton.props.checked;
}
}, {
key: 'updateRadioButtons',
value: function updateRadioButtons(newSelection) {
if (this.state.numberCheckedRadioButtons === 0) {
this.setState({ selected: newSelection });
} else {
true ? (0, _warning2.default)(false, 'Cannot select a different radio button while another radio button\n has the \'checked\' property set to true.') : void 0;
}
}
}, {
key: 'getSelectedValue',
value: function getSelectedValue() {
return this.state.selected;
}
}, {
key: 'setSelectedValue',
value: function setSelectedValue(newSelectionValue) {
this.updateRadioButtons(newSelectionValue);
}
}, {
key: 'clearValue',
value: function clearValue() {
this.setSelectedValue('');
}
}, {
key: 'render',
value: function render() {
var _this3 = this;
var prepareStyles = this.context.muiTheme.prepareStyles;
var options = _react2.default.Children.map(this.props.children, function (option) {
var _option$props = option.props;
var name = _option$props.name;
var // eslint-disable-line no-unused-vars
value = _option$props.value;
var // eslint-disable-line no-unused-vars
label = _option$props.label;
var // eslint-disable-line no-unused-vars
onCheck = _option$props.onCheck;
var other = _objectWithoutProperties(_option$props, ['name', 'value', 'label', 'onCheck']);
return _react2.default.createElement(_RadioButton2.default, _extends({}, other, {
ref: option.props.value,
name: _this3.props.name,
key: option.props.value,
value: option.props.value,
label: option.props.label,
labelPosition: _this3.props.labelPosition,
onCheck: _this3.handleChange,
checked: option.props.value === _this3.state.selected
}));
}, this);
return _react2.default.createElement(
'div',
{
style: prepareStyles((0, _simpleAssign2.default)({}, this.props.style)),
className: this.props.className
},
options
);
}
}]);
return RadioButtonGroup;
}(_react.Component);
RadioButtonGroup.propTypes = {
/**
* Should be used to pass `RadioButton` components.
*/
children: _react.PropTypes.node,
/**
* The CSS class name of the root element.
*/
className: _react.PropTypes.string,
/**
* The `value` property (case-sensitive) of the radio button that will be
* selected by default. This takes precedence over the `checked` property
* of the `RadioButton` elements.
*/
defaultSelected: _react.PropTypes.string,
/**
* Where the label will be placed for all child radio buttons.
* This takes precedence over the `labelPosition` property of the
* `RadioButton` elements.
*/
labelPosition: _react.PropTypes.oneOf(['left', 'right']),
/**
* The name that will be applied to all child radio buttons.
*/
name: _react.PropTypes.string.isRequired,
/**
* Callback function that is fired when a radio button has
* been checked.
*
* @param {object} event `change` event targeting the selected
* radio button.
* @param {string} value The `value` of the selected radio button.
*/
onChange: _react.PropTypes.func,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The `value` of the currently selected radio button.
*/
valueSelected: _react.PropTypes.string
};
RadioButtonGroup.defaultProps = {
style: {}
};
RadioButtonGroup.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = RadioButtonGroup;
/***/ },
/* 66 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.RadioButtonGroup = exports.RadioButton = undefined;
var _RadioButton2 = __webpack_require__(143);
var _RadioButton3 = _interopRequireDefault(_RadioButton2);
var _RadioButtonGroup2 = __webpack_require__(65);
var _RadioButtonGroup3 = _interopRequireDefault(_RadioButtonGroup2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.RadioButton = _RadioButton3.default;
exports.RadioButtonGroup = _RadioButtonGroup3.default;
exports.default = _RadioButton3.default;
/***/ },
/* 67 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol ? "symbol" : typeof obj; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _checkCircle = __webpack_require__(197);
var _checkCircle2 = _interopRequireDefault(_checkCircle);
var _SvgIcon = __webpack_require__(5);
var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var getStyles = function getStyles(_ref, _ref2) {
var active = _ref.active;
var completed = _ref.completed;
var disabled = _ref.disabled;
var muiTheme = _ref2.muiTheme;
var stepper = _ref2.stepper;
var _muiTheme$stepper = muiTheme.stepper;
var textColor = _muiTheme$stepper.textColor;
var disabledTextColor = _muiTheme$stepper.disabledTextColor;
var iconColor = _muiTheme$stepper.iconColor;
var inactiveIconColor = _muiTheme$stepper.inactiveIconColor;
var orientation = stepper.orientation;
var styles = {
root: {
height: orientation === 'horizontal' ? 72 : 64,
color: textColor,
display: 'flex',
alignItems: 'center',
fontSize: 14,
paddingLeft: 14,
paddingRight: 14
},
icon: {
color: iconColor,
display: 'block',
fontSize: 24,
width: 24,
height: 24
},
iconContainer: {
display: 'flex',
alignItems: 'center',
paddingRight: 8,
width: 24
}
};
if (active) {
styles.root.fontWeight = 500;
}
if (!completed && !active) {
styles.icon.color = inactiveIconColor;
}
if (disabled) {
styles.icon.color = inactiveIconColor;
styles.root.color = disabledTextColor;
}
return styles;
};
var StepLabel = function (_Component) {
_inherits(StepLabel, _Component);
function StepLabel() {
_classCallCheck(this, StepLabel);
return _possibleConstructorReturn(this, Object.getPrototypeOf(StepLabel).apply(this, arguments));
}
_createClass(StepLabel, [{
key: 'renderIcon',
value: function renderIcon(completed, icon, styles) {
var iconType = typeof icon === 'undefined' ? 'undefined' : _typeof(icon);
if (iconType === 'number' || iconType === 'string') {
if (completed) {
return _react2.default.createElement(_checkCircle2.default, {
color: styles.icon.color,
style: styles.icon
});
}
return _react2.default.createElement(
_SvgIcon2.default,
{ color: styles.icon.color, style: styles.icon },
_react2.default.createElement('circle', { cx: '12', cy: '12', r: '10' }),
_react2.default.createElement(
'text',
{
x: '12',
y: '16',
textAnchor: 'middle',
fontSize: '12',
fill: '#fff'
},
icon
)
);
}
return icon;
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var children = _props.children;
var completed = _props.completed;
var userIcon = _props.icon;
var style = _props.style;
var other = _objectWithoutProperties(_props, ['children', 'completed', 'icon', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var icon = this.renderIcon(completed, userIcon, styles);
return _react2.default.createElement(
'span',
_extends({ style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) }, other),
icon && _react2.default.createElement(
'span',
{ style: prepareStyles(styles.iconContainer) },
icon
),
children
);
}
}]);
return StepLabel;
}(_react.Component);
StepLabel.muiName = 'StepLabel';
StepLabel.propTypes = {
/**
* Sets active styling. Overrides disabled coloring.
*/
active: _react.PropTypes.bool,
/**
* The label text node
*/
children: _react.PropTypes.node,
/**
* Sets completed styling. Overrides disabled coloring.
*/
completed: _react.PropTypes.bool,
/**
* Sets disabled styling.
*/
disabled: _react.PropTypes.bool,
/**
* The icon displayed by the step label.
*/
icon: _react.PropTypes.oneOfType([_react.PropTypes.element, _react.PropTypes.string, _react.PropTypes.number]),
/**
* Override the inline-style of the root element.
*/
style: _react.PropTypes.object
};
StepLabel.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired,
stepper: _react.PropTypes.object
};
exports.default = StepLabel;
/***/ },
/* 68 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _Subheader = __webpack_require__(160);
var _Subheader2 = _interopRequireDefault(_Subheader);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _Subheader2.default;
/***/ },
/* 69 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol ? "symbol" : typeof obj; };
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _Checkbox = __webpack_require__(32);
var _Checkbox2 = _interopRequireDefault(_Checkbox);
var _TableRowColumn = __webpack_require__(29);
var _TableRowColumn2 = _interopRequireDefault(_TableRowColumn);
var _ClickAwayListener = __webpack_require__(41);
var _ClickAwayListener2 = _interopRequireDefault(_ClickAwayListener);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var TableBody = function (_Component) {
_inherits(TableBody, _Component);
function TableBody() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, TableBody);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(TableBody)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
selectedRows: _this.calculatePreselectedRows(_this.props)
}, _this.handleClickAway = function () {
if (_this.props.deselectOnClickaway && _this.state.selectedRows.length) {
_this.setState({
selectedRows: []
});
if (_this.props.onRowSelection) {
_this.props.onRowSelection([]);
}
}
}, _this.onRowClick = function (event, rowNumber) {
event.stopPropagation();
if (_this.props.selectable) {
// Prevent text selection while selecting rows.
window.getSelection().removeAllRanges();
_this.processRowSelection(event, rowNumber);
}
}, _this.onCellClick = function (event, rowNumber, columnNumber) {
event.stopPropagation();
if (_this.props.onCellClick) _this.props.onCellClick(rowNumber, _this.getColumnId(columnNumber), event);
}, _this.onCellHover = function (event, rowNumber, columnNumber) {
if (_this.props.onCellHover) _this.props.onCellHover(rowNumber, _this.getColumnId(columnNumber), event);
_this.onRowHover(event, rowNumber);
}, _this.onCellHoverExit = function (event, rowNumber, columnNumber) {
if (_this.props.onCellHoverExit) _this.props.onCellHoverExit(rowNumber, _this.getColumnId(columnNumber), event);
_this.onRowHoverExit(event, rowNumber);
}, _this.onRowHover = function (event, rowNumber) {
if (_this.props.onRowHover) _this.props.onRowHover(rowNumber);
}, _this.onRowHoverExit = function (event, rowNumber) {
if (_this.props.onRowHoverExit) _this.props.onRowHoverExit(rowNumber);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(TableBody, [{
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (this.props.allRowsSelected && !nextProps.allRowsSelected) {
this.setState({
selectedRows: this.state.selectedRows.length > 0 ? [this.state.selectedRows[this.state.selectedRows.length - 1]] : []
});
// TODO: should else be conditional, not run any time props other than allRowsSelected change?
} else {
this.setState({
selectedRows: this.calculatePreselectedRows(nextProps)
});
}
}
}, {
key: 'createRows',
value: function createRows() {
var _this2 = this;
var numChildren = _react2.default.Children.count(this.props.children);
var rowNumber = 0;
var handlers = {
onCellClick: this.onCellClick,
onCellHover: this.onCellHover,
onCellHoverExit: this.onCellHoverExit,
onRowHover: this.onRowHover,
onRowHoverExit: this.onRowHoverExit,
onRowClick: this.onRowClick
};
return _react2.default.Children.map(this.props.children, function (child) {
if (_react2.default.isValidElement(child)) {
var _ret2 = function () {
var props = {
displayRowCheckbox: _this2.props.displayRowCheckbox,
hoverable: _this2.props.showRowHover,
selected: _this2.isRowSelected(rowNumber),
striped: _this2.props.stripedRows && rowNumber % 2 === 0,
rowNumber: rowNumber++
};
var checkboxColumn = _this2.createRowCheckboxColumn(props);
if (rowNumber === numChildren) {
props.displayBorder = false;
}
var children = [checkboxColumn];
_react2.default.Children.forEach(child.props.children, function (child) {
children.push(child);
});
return {
v: _react2.default.cloneElement(child, _extends({}, props, handlers), children)
};
}();
if ((typeof _ret2 === 'undefined' ? 'undefined' : _typeof(_ret2)) === "object") return _ret2.v;
}
});
}
}, {
key: 'createRowCheckboxColumn',
value: function createRowCheckboxColumn(rowProps) {
if (!this.props.displayRowCheckbox) return null;
var key = rowProps.rowNumber + '-cb';
var checkbox = _react2.default.createElement(_Checkbox2.default, {
ref: 'rowSelectCB',
name: key,
value: 'selected',
disabled: !this.props.selectable,
checked: rowProps.selected
});
return _react2.default.createElement(
_TableRowColumn2.default,
{
key: key,
columnNumber: 0,
style: { width: 24 }
},
checkbox
);
}
}, {
key: 'calculatePreselectedRows',
value: function calculatePreselectedRows(props) {
// Determine what rows are 'pre-selected'.
var preSelectedRows = [];
if (props.selectable && props.preScanRows) {
(function () {
var index = 0;
_react2.default.Children.forEach(props.children, function (child) {
if (_react2.default.isValidElement(child)) {
if (child.props.selected && (preSelectedRows.length === 0 || props.multiSelectable)) {
preSelectedRows.push(index);
}
index++;
}
});
})();
}
return preSelectedRows;
}
}, {
key: 'isRowSelected',
value: function isRowSelected(rowNumber) {
if (this.props.allRowsSelected) {
return true;
}
for (var i = 0; i < this.state.selectedRows.length; i++) {
var selection = this.state.selectedRows[i];
if ((typeof selection === 'undefined' ? 'undefined' : _typeof(selection)) === 'object') {
if (this.isValueInRange(rowNumber, selection)) return true;
} else {
if (selection === rowNumber) return true;
}
}
return false;
}
}, {
key: 'isValueInRange',
value: function isValueInRange(value, range) {
if (!range) return false;
if (range.start <= value && value <= range.end || range.end <= value && value <= range.start) {
return true;
}
return false;
}
}, {
key: 'processRowSelection',
value: function processRowSelection(event, rowNumber) {
var selectedRows = this.state.selectedRows;
if (event.shiftKey && this.props.multiSelectable && selectedRows.length) {
var lastIndex = selectedRows.length - 1;
var lastSelection = selectedRows[lastIndex];
if ((typeof lastSelection === 'undefined' ? 'undefined' : _typeof(lastSelection)) === 'object') {
lastSelection.end = rowNumber;
} else {
selectedRows.splice(lastIndex, 1, { start: lastSelection, end: rowNumber });
}
} else if ((event.ctrlKey && !event.metaKey || event.metaKey && !event.ctrlKey) && this.props.multiSelectable) {
var idx = selectedRows.indexOf(rowNumber);
if (idx < 0) {
var foundRange = false;
for (var i = 0; i < selectedRows.length; i++) {
var range = selectedRows[i];
if ((typeof range === 'undefined' ? 'undefined' : _typeof(range)) !== 'object') continue;
if (this.isValueInRange(rowNumber, range)) {
var _selectedRows;
foundRange = true;
var values = this.splitRange(range, rowNumber);
(_selectedRows = selectedRows).splice.apply(_selectedRows, [i, 1].concat(_toConsumableArray(values)));
}
}
if (!foundRange) selectedRows.push(rowNumber);
} else {
selectedRows.splice(idx, 1);
}
} else {
if (selectedRows.length === 1 && selectedRows[0] === rowNumber) {
selectedRows = [];
} else {
selectedRows = [rowNumber];
}
}
this.setState({ selectedRows: selectedRows });
if (this.props.onRowSelection) this.props.onRowSelection(this.flattenRanges(selectedRows));
}
}, {
key: 'splitRange',
value: function splitRange(range, splitPoint) {
var splitValues = [];
var startOffset = range.start - splitPoint;
var endOffset = range.end - splitPoint;
// Process start half
splitValues.push.apply(splitValues, _toConsumableArray(this.genRangeOfValues(splitPoint, startOffset)));
// Process end half
splitValues.push.apply(splitValues, _toConsumableArray(this.genRangeOfValues(splitPoint, endOffset)));
return splitValues;
}
}, {
key: 'genRangeOfValues',
value: function genRangeOfValues(start, offset) {
var values = [];
var dir = offset > 0 ? -1 : 1; // This forces offset to approach 0 from either direction.
while (offset !== 0) {
values.push(start + offset);
offset += dir;
}
return values;
}
}, {
key: 'flattenRanges',
value: function flattenRanges(selectedRows) {
var rows = [];
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;
try {
for (var _iterator = selectedRows[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
var selection = _step.value;
if ((typeof selection === 'undefined' ? 'undefined' : _typeof(selection)) === 'object') {
var values = this.genRangeOfValues(selection.end, selection.start - selection.end);
rows.push.apply(rows, [selection.end].concat(_toConsumableArray(values)));
} else {
rows.push(selection);
}
}
} catch (err) {
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator.return) {
_iterator.return();
}
} finally {
if (_didIteratorError) {
throw _iteratorError;
}
}
}
return rows.sort();
}
}, {
key: 'getColumnId',
value: function getColumnId(columnNumber) {
var columnId = columnNumber;
if (this.props.displayRowCheckbox) columnId--;
return columnId;
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var className = _props.className;
var style = _props.style;
var prepareStyles = this.context.muiTheme.prepareStyles;
var rows = this.createRows();
return _react2.default.createElement(
_ClickAwayListener2.default,
{ onClickAway: this.handleClickAway },
_react2.default.createElement(
'tbody',
{ className: className, style: prepareStyles((0, _simpleAssign2.default)({}, style)) },
rows
)
);
}
}]);
return TableBody;
}(_react.Component);
TableBody.muiName = 'TableBody';
TableBody.propTypes = {
/**
* @ignore
* Set to true to indicate that all rows should be selected.
*/
allRowsSelected: _react.PropTypes.bool,
/**
* Children passed to table body.
*/
children: _react.PropTypes.node,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* Controls whether or not to deselect all selected
* rows after clicking outside the table.
*/
deselectOnClickaway: _react.PropTypes.bool,
/**
* Controls the display of the row checkbox. The default value is true.
*/
displayRowCheckbox: _react.PropTypes.bool,
/**
* @ignore
* If true, multiple table rows can be selected.
* CTRL/CMD+Click and SHIFT+Click are valid actions.
* The default value is false.
*/
multiSelectable: _react.PropTypes.bool,
/**
* @ignore
* Callback function for when a cell is clicked.
*/
onCellClick: _react.PropTypes.func,
/**
* @ignore
* Called when a table cell is hovered. rowNumber
* is the row number of the hovered row and columnId
* is the column number or the column key of the cell.
*/
onCellHover: _react.PropTypes.func,
/**
* @ignore
* Called when a table cell is no longer hovered.
* rowNumber is the row number of the row and columnId
* is the column number or the column key of the cell.
*/
onCellHoverExit: _react.PropTypes.func,
/**
* @ignore
* Called when a table row is hovered.
* rowNumber is the row number of the hovered row.
*/
onRowHover: _react.PropTypes.func,
/**
* @ignore
* Called when a table row is no longer
* hovered. rowNumber is the row number of the row
* that is no longer hovered.
*/
onRowHoverExit: _react.PropTypes.func,
/**
* @ignore
* Called when a row is selected. selectedRows is an
* array of all row selections. IF all rows have been selected,
* the string "all" will be returned instead to indicate that
* all rows have been selected.
*/
onRowSelection: _react.PropTypes.func,
/**
* Controls whether or not the rows are pre-scanned to determine
* initial state. If your table has a large number of rows and
* you are experiencing a delay in rendering, turn off this property.
*/
preScanRows: _react.PropTypes.bool,
/**
* @ignore
* If true, table rows can be selected. If multiple
* row selection is desired, enable multiSelectable.
* The default value is true.
*/
selectable: _react.PropTypes.bool,
/**
* If true, table rows will be highlighted when
* the cursor is hovering over the row. The default
* value is false.
*/
showRowHover: _react.PropTypes.bool,
/**
* If true, every other table row starting
* with the first row will be striped. The default value is false.
*/
stripedRows: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
TableBody.defaultProps = {
allRowsSelected: false,
deselectOnClickaway: true,
displayRowCheckbox: true,
multiSelectable: false,
preScanRows: true,
selectable: true,
style: {}
};
TableBody.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = TableBody;
/***/ },
/* 70 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _TableRowColumn = __webpack_require__(29);
var _TableRowColumn2 = _interopRequireDefault(_TableRowColumn);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var tableFooter = context.muiTheme.tableFooter;
return {
cell: {
borderTop: '1px solid ' + tableFooter.borderColor,
verticalAlign: 'bottom',
padding: 20,
textAlign: 'left',
whiteSpace: 'nowrap'
}
};
}
var TableFooter = function (_Component) {
_inherits(TableFooter, _Component);
function TableFooter() {
_classCallCheck(this, TableFooter);
return _possibleConstructorReturn(this, Object.getPrototypeOf(TableFooter).apply(this, arguments));
}
_createClass(TableFooter, [{
key: 'render',
value: function render() {
var _props = this.props;
var adjustForCheckbox = _props.adjustForCheckbox;
var children = _props.children;
var className = _props.className;
var style = _props.style;
var other = _objectWithoutProperties(_props, ['adjustForCheckbox', 'children', 'className', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var footerRows = _react2.default.Children.map(children, function (child, rowNumber) {
var newChildProps = {
displayBorder: false,
key: 'f-' + rowNumber,
rowNumber: rowNumber,
style: (0, _simpleAssign2.default)({}, styles.cell, child.props.style)
};
var newDescendants = void 0;
if (adjustForCheckbox) {
newDescendants = [_react2.default.createElement(_TableRowColumn2.default, { key: 'fpcb' + rowNumber, style: { width: 24 } })].concat(_toConsumableArray(_react2.default.Children.toArray(child.props.children)));
}
return _react2.default.cloneElement(child, newChildProps, newDescendants);
});
return _react2.default.createElement(
'tfoot',
_extends({ className: className, style: prepareStyles((0, _simpleAssign2.default)({}, style)) }, other),
footerRows
);
}
}]);
return TableFooter;
}(_react.Component);
TableFooter.muiName = 'TableFooter';
TableFooter.propTypes = {
/**
* @ignore
* Controls whether or not header rows should be adjusted
* for a checkbox column. If the select all checkbox is true,
* this property will not influence the number of columns.
* This is mainly useful for "super header" rows so that
* the checkbox column does not create an offset that needs
* to be accounted for manually.
*/
adjustForCheckbox: _react.PropTypes.bool,
/**
* Children passed to table footer.
*/
children: _react.PropTypes.node,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
TableFooter.defaultProps = {
adjustForCheckbox: true,
style: {}
};
TableFooter.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = TableFooter;
/***/ },
/* 71 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _Checkbox = __webpack_require__(32);
var _Checkbox2 = _interopRequireDefault(_Checkbox);
var _TableHeaderColumn = __webpack_require__(40);
var _TableHeaderColumn2 = _interopRequireDefault(_TableHeaderColumn);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var tableHeader = context.muiTheme.tableHeader;
return {
root: {
borderBottom: '1px solid ' + tableHeader.borderColor
}
};
}
var TableHeader = function (_Component) {
_inherits(TableHeader, _Component);
function TableHeader() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, TableHeader);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(TableHeader)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.handleCheckAll = function (event, checked) {
if (_this.props.onSelectAll) _this.props.onSelectAll(checked);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(TableHeader, [{
key: 'createSuperHeaderRows',
value: function createSuperHeaderRows() {
var numChildren = _react2.default.Children.count(this.props.children);
if (numChildren === 1) return undefined;
var superHeaders = [];
for (var index = 0; index < numChildren - 1; index++) {
var child = this.props.children[index];
if (!_react2.default.isValidElement(child)) continue;
var props = {
key: 'sh' + index,
rowNumber: index
};
superHeaders.push(this.createSuperHeaderRow(child, props));
}
if (superHeaders.length) return superHeaders;
}
}, {
key: 'createSuperHeaderRow',
value: function createSuperHeaderRow(child, props) {
var children = [];
if (this.props.adjustForCheckbox) {
children.push(this.getCheckboxPlaceholder(props));
}
_react2.default.Children.forEach(child.props.children, function (child) {
children.push(child);
});
return _react2.default.cloneElement(child, props, children);
}
}, {
key: 'createBaseHeaderRow',
value: function createBaseHeaderRow() {
var numChildren = _react2.default.Children.count(this.props.children);
var child = numChildren === 1 ? this.props.children : this.props.children[numChildren - 1];
var props = {
key: 'h' + numChildren,
rowNumber: numChildren
};
var children = [this.getSelectAllCheckboxColumn(props)];
_react2.default.Children.forEach(child.props.children, function (child) {
children.push(child);
});
return _react2.default.cloneElement(child, props, children);
}
}, {
key: 'getCheckboxPlaceholder',
value: function getCheckboxPlaceholder(props) {
if (!this.props.adjustForCheckbox) return null;
var key = 'hpcb' + props.rowNumber;
return _react2.default.createElement(_TableHeaderColumn2.default, { key: key, style: { width: 24 } });
}
}, {
key: 'getSelectAllCheckboxColumn',
value: function getSelectAllCheckboxColumn(props) {
if (!this.props.displaySelectAll) return this.getCheckboxPlaceholder(props);
var checkbox = _react2.default.createElement(_Checkbox2.default, {
key: 'selectallcb',
name: 'selectallcb',
value: 'selected',
disabled: !this.props.enableSelectAll,
checked: this.props.selectAllSelected,
onCheck: this.handleCheckAll
});
var key = 'hpcb' + props.rowNumber;
return _react2.default.createElement(
_TableHeaderColumn2.default,
{ key: key, style: { width: 24 } },
checkbox
);
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var className = _props.className;
var style = _props.style;
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var superHeaderRows = this.createSuperHeaderRows();
var baseHeaderRow = this.createBaseHeaderRow();
return _react2.default.createElement(
'thead',
{ className: className, style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) },
superHeaderRows,
baseHeaderRow
);
}
}]);
return TableHeader;
}(_react.Component);
TableHeader.muiName = 'TableHeader';
TableHeader.propTypes = {
/**
* Controls whether or not header rows should be
* adjusted for a checkbox column. If the select all
* checkbox is true, this property will not influence
* the number of columns. This is mainly useful for
* "super header" rows so that the checkbox column
* does not create an offset that needs to be accounted
* for manually.
*/
adjustForCheckbox: _react.PropTypes.bool,
/**
* Children passed to table header.
*/
children: _react.PropTypes.node,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* Controls whether or not the select all checkbox is displayed.
*/
displaySelectAll: _react.PropTypes.bool,
/**
* If set to true, the select all button will be interactable.
* If set to false, the button will not be interactable.
* To hide the checkbox, set displaySelectAll to false.
*/
enableSelectAll: _react.PropTypes.bool,
/**
* @ignore
* Callback when select all has been checked.
*/
onSelectAll: _react.PropTypes.func,
/**
* @ignore
* True when select all has been checked.
*/
selectAllSelected: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
TableHeader.defaultProps = {
adjustForCheckbox: true,
displaySelectAll: true,
enableSelectAll: true,
selectAllSelected: false
};
TableHeader.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = TableHeader;
/***/ },
/* 72 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context, state) {
var tableRow = context.muiTheme.tableRow;
var cellBgColor = 'inherit';
if (props.hovered || state.hovered) {
cellBgColor = tableRow.hoverColor;
} else if (props.selected) {
cellBgColor = tableRow.selectedColor;
} else if (props.striped) {
cellBgColor = tableRow.stripeColor;
}
return {
root: {
borderBottom: props.displayBorder && '1px solid ' + tableRow.borderColor,
color: tableRow.textColor,
height: tableRow.height
},
cell: {
backgroundColor: cellBgColor
}
};
}
var TableRow = function (_Component) {
_inherits(TableRow, _Component);
function TableRow() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, TableRow);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(TableRow)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
hovered: false
}, _this.onCellClick = function (event, columnIndex) {
if (_this.props.selectable && _this.props.onCellClick) {
_this.props.onCellClick(event, _this.props.rowNumber, columnIndex);
}
event.ctrlKey = true;
_this.onRowClick(event);
}, _this.onCellHover = function (event, columnIndex) {
if (_this.props.hoverable) {
_this.setState({ hovered: true });
if (_this.props.onCellHover) _this.props.onCellHover(event, _this.props.rowNumber, columnIndex);
_this.onRowHover(event);
}
}, _this.onCellHoverExit = function (event, columnIndex) {
if (_this.props.hoverable) {
_this.setState({ hovered: false });
if (_this.props.onCellHoverExit) _this.props.onCellHoverExit(event, _this.props.rowNumber, columnIndex);
_this.onRowHoverExit(event);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(TableRow, [{
key: 'onRowClick',
value: function onRowClick(event) {
if (this.props.selectable && this.props.onRowClick) this.props.onRowClick(event, this.props.rowNumber);
}
}, {
key: 'onRowHover',
value: function onRowHover(event) {
if (this.props.onRowHover) this.props.onRowHover(event, this.props.rowNumber);
}
}, {
key: 'onRowHoverExit',
value: function onRowHoverExit(event) {
if (this.props.onRowHoverExit) this.props.onRowHoverExit(event, this.props.rowNumber);
}
}, {
key: 'render',
value: function render() {
var _this2 = this;
var _props = this.props;
var className = _props.className;
var displayBorder = _props.displayBorder;
var // eslint-disable-line no-unused-vars
hoverable = _props.hoverable;
var // eslint-disable-line no-unused-vars
onCellClick = _props.onCellClick;
var // eslint-disable-line no-unused-vars
onCellHover = _props.onCellHover;
var // eslint-disable-line no-unused-vars
onCellHoverExit = _props.onCellHoverExit;
var // eslint-disable-line no-unused-vars
onRowClick = _props.onRowClick;
var // eslint-disable-line no-unused-vars
onRowHover = _props.onRowHover;
var // eslint-disable-line no-unused-vars
onRowHoverExit = _props.onRowHoverExit;
var // eslint-disable-line no-unused-vars
rowNumber = _props.rowNumber;
var // eslint-disable-line no-unused-vars
selectable = _props.selectable;
var // eslint-disable-line no-unused-vars
selected = _props.selected;
var // eslint-disable-line no-unused-vars
striped = _props.striped;
var // eslint-disable-line no-unused-vars
style = _props.style;
var other = _objectWithoutProperties(_props, ['className', 'displayBorder', 'hoverable', 'onCellClick', 'onCellHover', 'onCellHoverExit', 'onRowClick', 'onRowHover', 'onRowHoverExit', 'rowNumber', 'selectable', 'selected', 'striped', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context, this.state);
var rowColumns = _react2.default.Children.map(this.props.children, function (child, columnNumber) {
if (_react2.default.isValidElement(child)) {
return _react2.default.cloneElement(child, {
columnNumber: columnNumber,
hoverable: _this2.props.hoverable,
key: _this2.props.rowNumber + '-' + columnNumber,
onClick: _this2.onCellClick,
onHover: _this2.onCellHover,
onHoverExit: _this2.onCellHoverExit,
style: (0, _simpleAssign2.default)({}, styles.cell, child.props.style)
});
}
});
return _react2.default.createElement(
'tr',
_extends({
className: className,
style: prepareStyles((0, _simpleAssign2.default)(styles.root, style))
}, other),
rowColumns
);
}
}]);
return TableRow;
}(_react.Component);
TableRow.propTypes = {
/**
* Children passed to table row.
*/
children: _react.PropTypes.node,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* If true, row border will be displayed for the row.
* If false, no border will be drawn.
*/
displayBorder: _react.PropTypes.bool,
/**
* Controls whether or not the row reponseds to hover events.
*/
hoverable: _react.PropTypes.bool,
/**
* Controls whether or not the row should be rendered as being
* hovered. This property is evaluated in addition to this.state.hovered
* and can be used to synchronize the hovered state with some other
* external events.
*/
hovered: _react.PropTypes.bool,
/**
* @ignore
* Called when a row cell is clicked.
* rowNumber is the row number and columnId is
* the column number or the column key.
*/
onCellClick: _react.PropTypes.func,
/**
* @ignore
* Called when a table cell is hovered.
* rowNumber is the row number of the hovered row
* and columnId is the column number or the column key of the cell.
*/
onCellHover: _react.PropTypes.func,
/**
* @ignore
* Called when a table cell is no longer hovered.
* rowNumber is the row number of the row and columnId
* is the column number or the column key of the cell.
*/
onCellHoverExit: _react.PropTypes.func,
/**
* @ignore
* Called when row is clicked.
*/
onRowClick: _react.PropTypes.func,
/**
* @ignore
* Called when a table row is hovered.
* rowNumber is the row number of the hovered row.
*/
onRowHover: _react.PropTypes.func,
/**
* @ignore
* Called when a table row is no longer hovered.
* rowNumber is the row number of the row that is no longer hovered.
*/
onRowHoverExit: _react.PropTypes.func,
/**
* Number to identify the row. This property is
* automatically populated when used with the TableBody component.
*/
rowNumber: _react.PropTypes.number,
/**
* If true, table rows can be selected. If multiple row
* selection is desired, enable multiSelectable.
* The default value is true.
*/
selectable: _react.PropTypes.bool,
/**
* Indicates that a particular row is selected.
* This property can be used to programmatically select rows.
*/
selected: _react.PropTypes.bool,
/**
* Indicates whether or not the row is striped.
*/
striped: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
TableRow.defaultProps = {
displayBorder: true,
hoverable: false,
hovered: false,
selectable: true,
selected: false,
striped: false
};
TableRow.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = TableRow;
/***/ },
/* 73 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _EnhancedButton = __webpack_require__(11);
var _EnhancedButton2 = _interopRequireDefault(_EnhancedButton);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var tabs = context.muiTheme.tabs;
return {
root: {
color: props.selected ? tabs.selectedTextColor : tabs.textColor,
fontWeight: 500,
fontSize: 14,
width: props.width,
textTransform: 'uppercase',
padding: 0
},
button: {
display: 'flex',
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
height: props.label && props.icon ? 72 : 48
}
};
}
var Tab = function (_Component) {
_inherits(Tab, _Component);
function Tab() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, Tab);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(Tab)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.handleTouchTap = function (event) {
if (_this.props.onTouchTap) {
_this.props.onTouchTap(_this.props.value, event, _this);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(Tab, [{
key: 'render',
value: function render() {
var _props = this.props;
var
/* eslint-disable no-unused-vars */
onActive = _props.onActive;
var onTouchTap = _props.onTouchTap;
var selected = _props.selected;
var value = _props.value;
var width = _props.width;
var
/* eslint-enable no-unused-vars */
label = _props.label;
var style = _props.style;
var icon = _props.icon;
var other = _objectWithoutProperties(_props, ['onActive', 'onTouchTap', 'selected', 'value', 'width', 'label', 'style', 'icon']);
var styles = getStyles(this.props, this.context);
var iconElement = void 0;
if (icon && _react2.default.isValidElement(icon)) {
var iconProps = {
style: {
fontSize: 24,
color: styles.root.color,
marginBottom: label ? 5 : 0
}
};
// If it's svg icon set color via props
if (icon.type.muiName !== 'FontIcon') {
iconProps.color = styles.root.color;
}
iconElement = _react2.default.cloneElement(icon, iconProps);
}
var rippleOpacity = 0.3;
var rippleColor = this.context.muiTheme.tabs.selectedTextColor;
return _react2.default.createElement(
_EnhancedButton2.default,
_extends({}, other, {
style: (0, _simpleAssign2.default)(styles.root, style),
focusRippleColor: rippleColor,
touchRippleColor: rippleColor,
focusRippleOpacity: rippleOpacity,
touchRippleOpacity: rippleOpacity,
onTouchTap: this.handleTouchTap
}),
_react2.default.createElement(
'div',
{ style: styles.button },
iconElement,
label
)
);
}
}]);
return Tab;
}(_react.Component);
Tab.muiName = 'Tab';
Tab.propTypes = {
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* Sets the icon of the tab, you can pass `FontIcon` or `SvgIcon` elements.
*/
icon: _react.PropTypes.node,
/**
* Sets the text value of the tab item to the string specified.
*/
label: _react.PropTypes.node,
/**
* Fired when the active tab changes by touch or tap.
* Use this event to specify any functionality when an active tab changes.
* For example - we are using this to route to home when the third tab becomes active.
* This function will always recieve the active tab as it\'s first argument.
*/
onActive: _react.PropTypes.func,
/**
* @ignore
* This property is overriden by the Tabs component.
*/
onTouchTap: _react.PropTypes.func,
/**
* @ignore
* Defines if the current tab is selected or not.
* The Tabs component is responsible for setting this property.
*/
selected: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* If value prop passed to Tabs component, this value prop is also required.
* It assigns a value to the tab so that it can be selected by the Tabs.
*/
value: _react.PropTypes.any,
/**
* @ignore
* This property is overriden by the Tabs component.
*/
width: _react.PropTypes.string
};
Tab.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = Tab;
/***/ },
/* 74 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _timeUtils = __webpack_require__(22);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var styles = {
root: {
display: 'inline-block',
position: 'absolute',
width: 32,
height: 32,
borderRadius: '100%',
left: 'calc(50% - 16px)',
top: 10,
textAlign: 'center',
paddingTop: 5,
userSelect: 'none', /* Chrome all / Safari all */
fontSize: '1.1em',
pointerEvents: 'none',
boxSizing: 'border-box'
}
};
var muiTheme = context.muiTheme;
var pos = props.value;
if (props.type === 'hour') {
pos %= 12;
} else {
pos = pos / 5;
}
var positions = [[0, 5], [54.5, 16.6], [94.4, 59.5], [109, 114], [94.4, 168.5], [54.5, 208.4], [0, 223], [-54.5, 208.4], [-94.4, 168.5], [-109, 114], [-94.4, 59.5], [-54.5, 19.6]];
var innerPositions = [[0, 40], [36.9, 49.9], [64, 77], [74, 114], [64, 151], [37, 178], [0, 188], [-37, 178], [-64, 151], [-74, 114], [-64, 77], [-37, 50]];
if (props.isSelected) {
styles.root.backgroundColor = muiTheme.timePicker.accentColor;
styles.root.color = muiTheme.timePicker.selectTextColor;
}
var transformPos = positions[pos];
if ((0, _timeUtils.isInner)(props)) {
styles.root.width = 28;
styles.root.height = 28;
styles.root.left = 'calc(50% - 14px)';
transformPos = innerPositions[pos];
}
var _transformPos = transformPos;
var _transformPos2 = _slicedToArray(_transformPos, 2);
var x = _transformPos2[0];
var y = _transformPos2[1];
styles.root.transform = 'translate(' + x + 'px, ' + y + 'px)';
return styles;
}
var ClockNumber = function (_Component) {
_inherits(ClockNumber, _Component);
function ClockNumber() {
_classCallCheck(this, ClockNumber);
return _possibleConstructorReturn(this, Object.getPrototypeOf(ClockNumber).apply(this, arguments));
}
_createClass(ClockNumber, [{
key: 'render',
value: function render() {
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var clockNumber = this.props.value === 0 ? '00' : this.props.value;
return _react2.default.createElement(
'span',
{ style: prepareStyles(styles.root) },
clockNumber
);
}
}]);
return ClockNumber;
}(_react.Component);
ClockNumber.propTypes = {
isSelected: _react.PropTypes.bool,
onSelected: _react.PropTypes.func,
type: _react.PropTypes.oneOf(['hour', 'minute']),
value: _react.PropTypes.number
};
ClockNumber.defaultProps = {
value: 0,
type: 'minute',
isSelected: false
};
ClockNumber.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = ClockNumber;
/***/ },
/* 75 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _timeUtils = __webpack_require__(22);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function calcAngle(value, base) {
value %= base;
var angle = 360 / base * value;
return angle;
}
function getStyles(props, context, state) {
var hasSelected = props.hasSelected;
var type = props.type;
var value = props.value;
var inner = state.inner;
var timePicker = context.muiTheme.timePicker;
var angle = type === 'hour' ? calcAngle(value, 12) : calcAngle(value, 60);
var styles = {
root: {
height: inner ? '30%' : '40%',
background: timePicker.accentColor,
width: 2,
left: 'calc(50% - 1px)',
position: 'absolute',
bottom: '50%',
transformOrigin: 'bottom',
pointerEvents: 'none',
transform: 'rotateZ(' + angle + 'deg)'
},
mark: {
background: timePicker.selectTextColor,
border: '4px solid ' + timePicker.accentColor,
display: hasSelected && 'none',
width: 7,
height: 7,
position: 'absolute',
top: -5,
left: -6,
borderRadius: '100%'
}
};
return styles;
}
var ClockPointer = function (_Component) {
_inherits(ClockPointer, _Component);
function ClockPointer() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, ClockPointer);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(ClockPointer)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
inner: (0, _timeUtils.isInner)(_this.props)
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(ClockPointer, [{
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
this.setState({
inner: (0, _timeUtils.isInner)(nextProps)
});
}
}, {
key: 'render',
value: function render() {
if (this.props.value === null) {
return _react2.default.createElement('span', null);
}
var styles = getStyles(this.props, this.context, this.state);
var prepareStyles = this.context.muiTheme.prepareStyles;
return _react2.default.createElement(
'div',
{ style: prepareStyles(styles.root) },
_react2.default.createElement('div', { style: prepareStyles(styles.mark) })
);
}
}]);
return ClockPointer;
}(_react.Component);
ClockPointer.propTypes = {
hasSelected: _react.PropTypes.bool,
type: _react.PropTypes.oneOf(['hour', 'minute']),
value: _react.PropTypes.number
};
ClockPointer.defaultProps = {
value: null,
type: 'minute',
hasSelected: false
};
ClockPointer.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = ClockPointer;
/***/ },
/* 76 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var firstChild = props.firstChild;
var lastChild = props.lastChild;
var _context$muiTheme = context.muiTheme;
var baseTheme = _context$muiTheme.baseTheme;
var button = _context$muiTheme.button;
var toolbar = _context$muiTheme.toolbar;
var marginHorizontal = baseTheme.spacing.desktopGutter;
var marginVertical = (toolbar.height - button.height) / 2;
var styles = {
root: {
position: 'relative',
marginLeft: firstChild ? -marginHorizontal : undefined,
marginRight: lastChild ? -marginHorizontal : undefined,
display: 'flex',
justifyContent: 'space-between'
},
dropDownMenu: {
root: {
color: toolbar.color, // removes hover color change, we want to keep it
marginRight: baseTheme.spacing.desktopGutter,
flex: 1,
whiteSpace: 'nowrap'
},
controlBg: {
backgroundColor: toolbar.menuHoverColor,
borderRadius: 0
},
underline: {
display: 'none'
}
},
button: {
margin: marginVertical + 'px ' + marginHorizontal + 'px',
position: 'relative'
},
icon: {
root: {
cursor: 'pointer',
color: toolbar.iconColor,
lineHeight: toolbar.height + 'px',
paddingLeft: baseTheme.spacing.desktopGutter
},
hover: {
color: toolbar.hoverColor
}
},
span: {
color: toolbar.iconColor,
lineHeight: toolbar.height + 'px'
}
};
return styles;
}
var ToolbarGroup = function (_Component) {
_inherits(ToolbarGroup, _Component);
function ToolbarGroup() {
_classCallCheck(this, ToolbarGroup);
return _possibleConstructorReturn(this, Object.getPrototypeOf(ToolbarGroup).apply(this, arguments));
}
_createClass(ToolbarGroup, [{
key: 'handleMouseEnterFontIcon',
value: function handleMouseEnterFontIcon(style) {
return function (event) {
event.target.style.zIndex = style.hover.zIndex;
event.target.style.color = style.hover.color;
};
}
}, {
key: 'handleMouseLeaveFontIcon',
value: function handleMouseLeaveFontIcon(style) {
return function (event) {
event.target.style.zIndex = 'auto';
event.target.style.color = style.root.color;
};
}
}, {
key: 'render',
value: function render() {
var _this2 = this;
var _props = this.props;
var children = _props.children;
var className = _props.className;
var style = _props.style;
var other = _objectWithoutProperties(_props, ['children', 'className', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var newChildren = _react2.default.Children.map(children, function (currentChild) {
if (!currentChild) {
return null;
}
if (!currentChild.type) {
return currentChild;
}
switch (currentChild.type.muiName) {
case 'DropDownMenu':
return _react2.default.cloneElement(currentChild, {
style: (0, _simpleAssign2.default)({}, styles.dropDownMenu.root, currentChild.props.style),
styleControlBg: styles.dropDownMenu.controlBg,
styleUnderline: styles.dropDownMenu.underline
});
case 'RaisedButton':
case 'FlatButton':
return _react2.default.cloneElement(currentChild, {
style: (0, _simpleAssign2.default)({}, styles.button, currentChild.props.style)
});
case 'FontIcon':
return _react2.default.cloneElement(currentChild, {
style: (0, _simpleAssign2.default)({}, styles.icon.root, currentChild.props.style),
onMouseEnter: _this2.handleMouseEnterFontIcon(styles.icon),
onMouseLeave: _this2.handleMouseLeaveFontIcon(styles.icon)
});
case 'ToolbarSeparator':
case 'ToolbarTitle':
return _react2.default.cloneElement(currentChild, {
style: (0, _simpleAssign2.default)({}, styles.span, currentChild.props.style)
});
default:
return currentChild;
}
}, this);
return _react2.default.createElement(
'div',
_extends({}, other, { className: className, style: prepareStyles((0, _simpleAssign2.default)({}, styles.root, style)) }),
newChildren
);
}
}]);
return ToolbarGroup;
}(_react.Component);
ToolbarGroup.propTypes = {
/**
* Can be any node or number of nodes.
*/
children: _react.PropTypes.node,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* Set this to true for if the `ToolbarGroup` is the first child of `Toolbar`
* to prevent setting the left gap.
*/
firstChild: _react.PropTypes.bool,
/**
* Determines the side the `ToolbarGroup` will snap to. Either 'left' or 'right'.
*/
float: _react.PropTypes.oneOf(['left', 'right']),
/**
* Set this to true for if the `ToolbarGroup` is the last child of `Toolbar`
* to prevent setting the right gap.
*/
lastChild: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
ToolbarGroup.defaultProps = {
firstChild: false,
lastChild: false
};
ToolbarGroup.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = ToolbarGroup;
/***/ },
/* 77 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var _context$muiTheme = context.muiTheme;
var baseTheme = _context$muiTheme.baseTheme;
var toolbar = _context$muiTheme.toolbar;
return {
root: {
backgroundColor: toolbar.separatorColor,
display: 'inline-block',
height: baseTheme.spacing.desktopGutterMore,
marginLeft: baseTheme.spacing.desktopGutter,
position: 'relative',
top: (toolbar.height - baseTheme.spacing.desktopGutterMore) / 2,
width: 1
}
};
}
var ToolbarSeparator = function (_Component) {
_inherits(ToolbarSeparator, _Component);
function ToolbarSeparator() {
_classCallCheck(this, ToolbarSeparator);
return _possibleConstructorReturn(this, Object.getPrototypeOf(ToolbarSeparator).apply(this, arguments));
}
_createClass(ToolbarSeparator, [{
key: 'render',
value: function render() {
var _props = this.props;
var className = _props.className;
var style = _props.style;
var other = _objectWithoutProperties(_props, ['className', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
return _react2.default.createElement('span', _extends({}, other, { className: className, style: prepareStyles((0, _simpleAssign2.default)({}, styles.root, style)) }));
}
}]);
return ToolbarSeparator;
}(_react.Component);
ToolbarSeparator.muiName = 'ToolbarSeparator';
ToolbarSeparator.propTypes = {
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
ToolbarSeparator.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = ToolbarSeparator;
/***/ },
/* 78 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var _context$muiTheme = context.muiTheme;
var baseTheme = _context$muiTheme.baseTheme;
var toolbar = _context$muiTheme.toolbar;
return {
root: {
paddingRight: baseTheme.spacing.desktopGutterLess,
lineHeight: toolbar.height + 'px',
fontSize: toolbar.titleFontSize,
position: 'relative',
textOverflow: 'ellipsis',
whiteSpace: 'nowrap',
overflow: 'hidden'
}
};
}
var ToolbarTitle = function (_Component) {
_inherits(ToolbarTitle, _Component);
function ToolbarTitle() {
_classCallCheck(this, ToolbarTitle);
return _possibleConstructorReturn(this, Object.getPrototypeOf(ToolbarTitle).apply(this, arguments));
}
_createClass(ToolbarTitle, [{
key: 'render',
value: function render() {
var _props = this.props;
var className = _props.className;
var style = _props.style;
var text = _props.text;
var other = _objectWithoutProperties(_props, ['className', 'style', 'text']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
return _react2.default.createElement(
'span',
_extends({}, other, { className: className, style: prepareStyles((0, _simpleAssign2.default)({}, styles.root, style)) }),
text
);
}
}]);
return ToolbarTitle;
}(_react.Component);
ToolbarTitle.muiName = 'ToolbarTitle';
ToolbarTitle.propTypes = {
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The text to be displayed.
*/
text: _react.PropTypes.string
};
ToolbarTitle.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = ToolbarTitle;
/***/ },
/* 79 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _BeforeAfterWrapper = __webpack_require__(186);
var _BeforeAfterWrapper2 = _interopRequireDefault(_BeforeAfterWrapper);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
var styles = {
before: {
content: "' '",
display: 'table'
},
after: {
content: "' '",
clear: 'both',
display: 'table'
}
};
var ClearFix = function ClearFix(_ref) {
var style = _ref.style;
var children = _ref.children;
var other = _objectWithoutProperties(_ref, ['style', 'children']);
return _react2.default.createElement(
_BeforeAfterWrapper2.default,
_extends({}, other, {
beforeStyle: styles.before,
afterStyle: styles.after,
style: style
}),
children
);
};
ClearFix.muiName = 'ClearFix';
ClearFix.propTypes = {
children: _react.PropTypes.node,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
exports.default = ClearFix;
/***/ },
/* 80 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _AutoLockScrolling = __webpack_require__(185);
var _AutoLockScrolling2 = _interopRequireDefault(_AutoLockScrolling);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var overlay = context.muiTheme.overlay;
var style = {
root: {
position: 'fixed',
height: '100%',
width: '100%',
top: 0,
left: '-100%',
opacity: 0,
backgroundColor: overlay.backgroundColor,
WebkitTapHighlightColor: 'rgba(0, 0, 0, 0)', // Remove mobile color flashing (deprecated)
// Two ways to promote overlay to its own render layer
willChange: 'opacity',
transform: 'translateZ(0)',
transition: props.transitionEnabled && _transitions2.default.easeOut('0ms', 'left', '400ms') + ', ' + _transitions2.default.easeOut('400ms', 'opacity')
}
};
if (props.show) {
(0, _simpleAssign2.default)(style.root, {
left: 0,
opacity: 1,
transition: _transitions2.default.easeOut('0ms', 'left') + ', ' + _transitions2.default.easeOut('400ms', 'opacity')
});
}
return style;
}
var Overlay = function (_Component) {
_inherits(Overlay, _Component);
function Overlay() {
_classCallCheck(this, Overlay);
return _possibleConstructorReturn(this, Object.getPrototypeOf(Overlay).apply(this, arguments));
}
_createClass(Overlay, [{
key: 'setOpacity',
value: function setOpacity(opacity) {
this.refs.overlay.style.opacity = opacity;
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var autoLockScrolling = _props.autoLockScrolling;
var show = _props.show;
var style = _props.style;
var other = _objectWithoutProperties(_props, ['autoLockScrolling', 'show', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
return _react2.default.createElement(
'div',
_extends({}, other, { ref: 'overlay', style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) }),
autoLockScrolling && _react2.default.createElement(_AutoLockScrolling2.default, { lock: show })
);
}
}]);
return Overlay;
}(_react.Component);
Overlay.propTypes = {
autoLockScrolling: _react.PropTypes.bool,
show: _react.PropTypes.bool.isRequired,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
transitionEnabled: _react.PropTypes.bool
};
Overlay.defaultProps = {
autoLockScrolling: true,
transitionEnabled: true,
style: {}
};
Overlay.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = Overlay;
/***/ },
/* 81 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _reactDom = __webpack_require__(4);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _dom = __webpack_require__(87);
var _dom2 = _interopRequireDefault(_dom);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
// heavily inspired by https://github.com/Khan/react-components/blob/master/js/layered-component-mixin.jsx
var RenderToLayer = function (_Component) {
_inherits(RenderToLayer, _Component);
function RenderToLayer() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, RenderToLayer);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(RenderToLayer)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.onClickAway = function (event) {
if (event.defaultPrevented) {
return;
}
if (!_this.props.componentClickAway) {
return;
}
if (!_this.props.open) {
return;
}
var el = _this.layer;
if (event.target !== el && event.target === window || document.documentElement.contains(event.target) && !_dom2.default.isDescendant(el, event.target)) {
_this.props.componentClickAway(event);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(RenderToLayer, [{
key: 'componentDidMount',
value: function componentDidMount() {
this.renderLayer();
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
this.renderLayer();
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
this.unrenderLayer();
}
}, {
key: 'getLayer',
value: function getLayer() {
return this.layer;
}
}, {
key: 'unrenderLayer',
value: function unrenderLayer() {
if (!this.layer) {
return;
}
if (this.props.useLayerForClickAway) {
this.layer.style.position = 'relative';
this.layer.removeEventListener('touchstart', this.onClickAway);
this.layer.removeEventListener('click', this.onClickAway);
} else {
window.removeEventListener('touchstart', this.onClickAway);
window.removeEventListener('click', this.onClickAway);
}
_reactDom2.default.unmountComponentAtNode(this.layer);
document.body.removeChild(this.layer);
this.layer = null;
}
}, {
key: 'renderLayer',
value: function renderLayer() {
var _this2 = this;
var _props = this.props;
var open = _props.open;
var render = _props.render;
if (open) {
if (!this.layer) {
this.layer = document.createElement('div');
document.body.appendChild(this.layer);
if (this.props.useLayerForClickAway) {
this.layer.addEventListener('touchstart', this.onClickAway);
this.layer.addEventListener('click', this.onClickAway);
this.layer.style.position = 'fixed';
this.layer.style.top = 0;
this.layer.style.bottom = 0;
this.layer.style.left = 0;
this.layer.style.right = 0;
this.layer.style.zIndex = this.context.muiTheme.zIndex.layer;
} else {
setTimeout(function () {
window.addEventListener('touchstart', _this2.onClickAway);
window.addEventListener('click', _this2.onClickAway);
}, 0);
}
}
// By calling this method in componentDidMount() and
// componentDidUpdate(), you're effectively creating a "wormhole" that
// funnels React's hierarchical updates through to a DOM node on an
// entirely different part of the page.
var layerElement = render();
if (layerElement === null) {
this.layerElement = _reactDom2.default.unstable_renderSubtreeIntoContainer(this, null, this.layer);
} else {
this.layerElement = _reactDom2.default.unstable_renderSubtreeIntoContainer(this, layerElement, this.layer);
}
} else {
this.unrenderLayer();
}
}
}, {
key: 'render',
value: function render() {
return null;
}
}]);
return RenderToLayer;
}(_react.Component);
RenderToLayer.propTypes = {
componentClickAway: _react.PropTypes.func,
open: _react.PropTypes.bool.isRequired,
render: _react.PropTypes.func.isRequired,
useLayerForClickAway: _react.PropTypes.bool
};
RenderToLayer.defaultProps = {
useLayerForClickAway: true
};
RenderToLayer.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = RenderToLayer;
/***/ },
/* 82 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context, state) {
var verticalPosition = props.verticalPosition;
var horizontalPosition = props.horizontalPosition;
var touchMarginOffset = props.touch ? 10 : 0;
var touchOffsetTop = props.touch ? -20 : -10;
var offset = verticalPosition === 'bottom' ? 14 + touchMarginOffset : -14 - touchMarginOffset;
var _context$muiTheme = context.muiTheme;
var baseTheme = _context$muiTheme.baseTheme;
var zIndex = _context$muiTheme.zIndex;
var tooltip = _context$muiTheme.tooltip;
var styles = {
root: {
position: 'absolute',
fontFamily: baseTheme.fontFamily,
fontSize: '10px',
lineHeight: '22px',
padding: '0 8px',
zIndex: zIndex.tooltip,
color: tooltip.color,
overflow: 'hidden',
top: -10000,
borderRadius: 2,
userSelect: 'none',
opacity: 0,
right: horizontalPosition === 'left' ? 12 : null,
left: horizontalPosition === 'center' ? (state.offsetWidth - 48) / 2 * -1 : null,
transition: _transitions2.default.easeOut('0ms', 'top', '450ms') + ', ' + _transitions2.default.easeOut('450ms', 'transform', '0ms') + ', ' + _transitions2.default.easeOut('450ms', 'opacity', '0ms')
},
label: {
position: 'relative',
whiteSpace: 'nowrap'
},
ripple: {
position: 'absolute',
left: horizontalPosition === 'center' ? '50%' : horizontalPosition === 'left' ? '100%' : '0%',
top: verticalPosition === 'bottom' ? 0 : '100%',
transform: 'translate(-50%, -50%)',
borderRadius: '50%',
backgroundColor: 'transparent',
transition: _transitions2.default.easeOut('0ms', 'width', '450ms') + ', ' + _transitions2.default.easeOut('0ms', 'height', '450ms') + ', ' + _transitions2.default.easeOut('450ms', 'backgroundColor', '0ms')
},
rootWhenShown: {
top: verticalPosition === 'top' ? touchOffsetTop : 36,
opacity: 0.9,
transform: 'translate3d(0px, ' + offset + 'px, 0px)',
transition: _transitions2.default.easeOut('0ms', 'top', '0ms') + ', ' + _transitions2.default.easeOut('450ms', 'transform', '0ms') + ', ' + _transitions2.default.easeOut('450ms', 'opacity', '0ms')
},
rootWhenTouched: {
fontSize: '14px',
lineHeight: '32px',
padding: '0 16px'
},
rippleWhenShown: {
backgroundColor: tooltip.rippleBackgroundColor,
transition: _transitions2.default.easeOut('450ms', 'width', '0ms') + ', ' + _transitions2.default.easeOut('450ms', 'height', '0ms') + ', ' + _transitions2.default.easeOut('450ms', 'backgroundColor', '0ms')
}
};
return styles;
}
var Tooltip = function (_Component) {
_inherits(Tooltip, _Component);
function Tooltip() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, Tooltip);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(Tooltip)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
offsetWidth: null
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(Tooltip, [{
key: 'componentDidMount',
value: function componentDidMount() {
this.setRippleSize();
this.setTooltipPosition();
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps() {
this.setTooltipPosition();
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
this.setRippleSize();
}
}, {
key: 'setRippleSize',
value: function setRippleSize() {
var ripple = this.refs.ripple;
var tooltip = this.refs.tooltip;
var tooltipWidth = parseInt(tooltip.offsetWidth, 10) / (this.props.horizontalPosition === 'center' ? 2 : 1);
var tooltipHeight = parseInt(tooltip.offsetHeight, 10);
var rippleDiameter = Math.ceil(Math.sqrt(Math.pow(tooltipHeight, 2) + Math.pow(tooltipWidth, 2)) * 2);
if (this.props.show) {
ripple.style.height = rippleDiameter + 'px';
ripple.style.width = rippleDiameter + 'px';
} else {
ripple.style.width = '0px';
ripple.style.height = '0px';
}
}
}, {
key: 'setTooltipPosition',
value: function setTooltipPosition() {
this.setState({ offsetWidth: this.refs.tooltip.offsetWidth });
}
}, {
key: 'render',
value: function render() {
var prepareStyles = this.context.muiTheme.prepareStyles;
var _props = this.props;
var label = _props.label;
var other = _objectWithoutProperties(_props, ['label']);
var styles = getStyles(this.props, this.context, this.state);
return _react2.default.createElement(
'div',
_extends({}, other, {
ref: 'tooltip',
style: prepareStyles((0, _simpleAssign2.default)(styles.root, this.props.show && styles.rootWhenShown, this.props.touch && styles.rootWhenTouched, this.props.style))
}),
_react2.default.createElement('div', {
ref: 'ripple',
style: prepareStyles((0, _simpleAssign2.default)(styles.ripple, this.props.show && styles.rippleWhenShown))
}),
_react2.default.createElement(
'span',
{ style: prepareStyles(styles.label) },
label
)
);
}
}]);
return Tooltip;
}(_react.Component);
Tooltip.propTypes = {
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
horizontalPosition: _react.PropTypes.oneOf(['left', 'right', 'center']),
label: _react.PropTypes.node.isRequired,
show: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
touch: _react.PropTypes.bool,
verticalPosition: _react.PropTypes.oneOf(['top', 'bottom'])
};
Tooltip.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = Tooltip;
/***/ },
/* 83 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactDom = __webpack_require__(4);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _reactAddonsTransitionGroup = __webpack_require__(26);
var _reactAddonsTransitionGroup2 = _interopRequireDefault(_reactAddonsTransitionGroup);
var _dom = __webpack_require__(87);
var _dom2 = _interopRequireDefault(_dom);
var _CircleRipple = __webpack_require__(187);
var _CircleRipple2 = _interopRequireDefault(_CircleRipple);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function _toArray(arr) { return Array.isArray(arr) ? arr : Array.from(arr); }
// Remove the first element of the array
var shift = function shift(_ref) {
var _ref2 = _toArray(_ref);
var newArray = _ref2.slice(1);
return newArray;
};
var TouchRipple = function (_Component) {
_inherits(TouchRipple, _Component);
function TouchRipple(props, context) {
_classCallCheck(this, TouchRipple);
// Touch start produces a mouse down event for compat reasons. To avoid
// showing ripples twice we skip showing a ripple for the first mouse down
// after a touch start. Note we don't store ignoreNextMouseDown in this.state
// to avoid re-rendering when we change it.
var _this = _possibleConstructorReturn(this, Object.getPrototypeOf(TouchRipple).call(this, props, context));
_this.handleMouseDown = function (event) {
// only listen to left clicks
if (event.button === 0) {
_this.start(event, false);
}
};
_this.handleMouseUp = function () {
_this.end();
};
_this.handleMouseLeave = function () {
_this.end();
};
_this.handleTouchStart = function (event) {
event.stopPropagation();
// If the user is swiping (not just tapping), save the position so we can
// abort ripples if the user appears to be scrolling.
if (_this.props.abortOnScroll && event.touches) {
_this.startListeningForScrollAbort(event);
_this.startTime = Date.now();
}
_this.start(event, true);
};
_this.handleTouchEnd = function () {
_this.end();
};
_this.handleTouchMove = function (event) {
// Stop trying to abort if we're already 300ms into the animation
var timeSinceStart = Math.abs(Date.now() - _this.startTime);
if (timeSinceStart > 300) {
_this.stopListeningForScrollAbort();
return;
}
// If the user is scrolling...
var deltaY = Math.abs(event.touches[0].clientY - _this.firstTouchY);
var deltaX = Math.abs(event.touches[0].clientX - _this.firstTouchX);
// Call it a scroll after an arbitrary 6px (feels reasonable in testing)
if (deltaY > 6 || deltaX > 6) {
var currentRipples = _this.state.ripples;
var ripple = currentRipples[0];
// This clone will replace the ripple in ReactTransitionGroup with a
// version that will disappear immediately when removed from the DOM
var abortedRipple = _react2.default.cloneElement(ripple, { aborted: true });
// Remove the old ripple and replace it with the new updated one
currentRipples = shift(currentRipples);
currentRipples = [].concat(_toConsumableArray(currentRipples), [abortedRipple]);
_this.setState({ ripples: currentRipples }, function () {
// Call end after we've set the ripple to abort otherwise the setState
// in end() merges with this and the ripple abort fails
_this.end();
});
}
};
_this.ignoreNextMouseDown = false;
_this.state = {
// This prop allows us to only render the ReactTransitionGroup
// on the first click of the component, making the inital render faster.
hasRipples: false,
nextKey: 0,
ripples: []
};
return _this;
}
_createClass(TouchRipple, [{
key: 'start',
value: function start(event, isRippleTouchGenerated) {
var theme = this.context.muiTheme.ripple;
if (this.ignoreNextMouseDown && !isRippleTouchGenerated) {
this.ignoreNextMouseDown = false;
return;
}
var ripples = this.state.ripples;
// Add a ripple to the ripples array
ripples = [].concat(_toConsumableArray(ripples), [_react2.default.createElement(_CircleRipple2.default, {
key: this.state.nextKey,
style: !this.props.centerRipple ? this.getRippleStyle(event) : {},
color: this.props.color || theme.color,
opacity: this.props.opacity,
touchGenerated: isRippleTouchGenerated
})]);
this.ignoreNextMouseDown = isRippleTouchGenerated;
this.setState({
hasRipples: true,
nextKey: this.state.nextKey + 1,
ripples: ripples
});
}
}, {
key: 'end',
value: function end() {
var currentRipples = this.state.ripples;
this.setState({
ripples: shift(currentRipples)
});
if (this.props.abortOnScroll) {
this.stopListeningForScrollAbort();
}
}
// Check if the user seems to be scrolling and abort the animation if so
}, {
key: 'startListeningForScrollAbort',
value: function startListeningForScrollAbort(event) {
this.firstTouchY = event.touches[0].clientY;
this.firstTouchX = event.touches[0].clientX;
// Note that when scolling Chrome throttles this event to every 200ms
// Also note we don't listen for scroll events directly as there's no general
// way to cover cases like scrolling within containers on the page
document.body.addEventListener('touchmove', this.handleTouchMove);
}
}, {
key: 'stopListeningForScrollAbort',
value: function stopListeningForScrollAbort() {
document.body.removeEventListener('touchmove', this.handleTouchMove);
}
}, {
key: 'getRippleStyle',
value: function getRippleStyle(event) {
var style = {};
var el = _reactDom2.default.findDOMNode(this);
var elHeight = el.offsetHeight;
var elWidth = el.offsetWidth;
var offset = _dom2.default.offset(el);
var isTouchEvent = event.touches && event.touches.length;
var pageX = isTouchEvent ? event.touches[0].pageX : event.pageX;
var pageY = isTouchEvent ? event.touches[0].pageY : event.pageY;
var pointerX = pageX - offset.left;
var pointerY = pageY - offset.top;
var topLeftDiag = this.calcDiag(pointerX, pointerY);
var topRightDiag = this.calcDiag(elWidth - pointerX, pointerY);
var botRightDiag = this.calcDiag(elWidth - pointerX, elHeight - pointerY);
var botLeftDiag = this.calcDiag(pointerX, elHeight - pointerY);
var rippleRadius = Math.max(topLeftDiag, topRightDiag, botRightDiag, botLeftDiag);
var rippleSize = rippleRadius * 2;
var left = pointerX - rippleRadius;
var top = pointerY - rippleRadius;
style.height = rippleSize + 'px';
style.width = rippleSize + 'px';
style.top = top + 'px';
style.left = left + 'px';
return style;
}
}, {
key: 'calcDiag',
value: function calcDiag(a, b) {
return Math.sqrt(a * a + b * b);
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var children = _props.children;
var style = _props.style;
var _state = this.state;
var hasRipples = _state.hasRipples;
var ripples = _state.ripples;
var prepareStyles = this.context.muiTheme.prepareStyles;
var rippleGroup = void 0;
if (hasRipples) {
var mergedStyles = (0, _simpleAssign2.default)({
height: '100%',
width: '100%',
position: 'absolute',
top: 0,
left: 0,
overflow: 'hidden'
}, style);
rippleGroup = _react2.default.createElement(
_reactAddonsTransitionGroup2.default,
{ style: prepareStyles(mergedStyles) },
ripples
);
}
return _react2.default.createElement(
'div',
{
onMouseUp: this.handleMouseUp,
onMouseDown: this.handleMouseDown,
onMouseLeave: this.handleMouseLeave,
onTouchStart: this.handleTouchStart,
onTouchEnd: this.handleTouchEnd
},
rippleGroup,
children
);
}
}]);
return TouchRipple;
}(_react.Component);
TouchRipple.propTypes = {
abortOnScroll: _react.PropTypes.bool,
centerRipple: _react.PropTypes.bool,
children: _react.PropTypes.node,
color: _react.PropTypes.string,
opacity: _react.PropTypes.number,
style: _react.PropTypes.object
};
TouchRipple.defaultProps = {
abortOnScroll: true
};
TouchRipple.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = TouchRipple;
/***/ },
/* 84 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _colors = __webpack_require__(23);
var _colorManipulator = __webpack_require__(12);
var _spacing = __webpack_require__(46);
var _spacing2 = _interopRequireDefault(_spacing);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
* Light Theme is the default theme used in material-ui. It is guaranteed to
* have all theme variables needed for every component. Variables not defined
* in a custom theme will default to these values.
*/
exports.default = {
spacing: _spacing2.default,
fontFamily: 'Roboto, sans-serif',
palette: {
primary1Color: _colors.cyan500,
primary2Color: _colors.cyan700,
primary3Color: _colors.grey400,
accent1Color: _colors.pinkA200,
accent2Color: _colors.grey100,
accent3Color: _colors.grey500,
textColor: _colors.darkBlack,
alternateTextColor: _colors.white,
canvasColor: _colors.white,
borderColor: _colors.grey300,
disabledColor: (0, _colorManipulator.fade)(_colors.darkBlack, 0.3),
pickerHeaderColor: _colors.cyan500,
clockCircleColor: (0, _colorManipulator.fade)(_colors.darkBlack, 0.07),
shadowColor: _colors.fullBlack
}
}; /**
* NB: If you update this file, please also update `docs/src/app/customization/Themes.js`
*/
/***/ },
/* 85 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _colors = __webpack_require__(23);
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
var Typography = function Typography() {
_classCallCheck(this, Typography);
// text colors
this.textFullBlack = _colors.fullBlack;
this.textDarkBlack = _colors.darkBlack;
this.textLightBlack = _colors.lightBlack;
this.textMinBlack = _colors.minBlack;
this.textFullWhite = _colors.fullWhite;
this.textDarkWhite = _colors.darkWhite;
this.textLightWhite = _colors.lightWhite;
// font weight
this.fontWeightLight = 300;
this.fontWeightNormal = 400;
this.fontWeightMedium = 500;
this.fontStyleButtonFontSize = 14;
};
exports.default = new Typography();
/***/ },
/* 86 */
/***/ function(module, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = {
menu: 1000,
appBar: 1100,
drawerOverlay: 1200,
drawer: 1300,
dialogOverlay: 1400,
dialog: 1500,
layer: 2000,
popover: 2100,
snackbar: 2900,
tooltip: 3000
};
/***/ },
/* 87 */
/***/ function(module, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = {
isDescendant: function isDescendant(parent, child) {
var node = child.parentNode;
while (node !== null) {
if (node === parent) return true;
node = node.parentNode;
}
return false;
},
offset: function offset(el) {
var rect = el.getBoundingClientRect();
return {
top: rect.top + document.body.scrollTop,
left: rect.left + document.body.scrollLeft
};
}
};
/***/ },
/* 88 */
/***/ function(module, exports) {
"use strict";
/**
* Copyright (c) 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
*
*/
function makeEmptyFunction(arg) {
return function () {
return arg;
};
}
/**
* This function accepts and discards inputs; it has no side effects. This is
* primarily useful idiomatically for overridable function endpoints which
* always need to be callable, since JS lacks a null-call idiom ala Cocoa.
*/
var emptyFunction = function emptyFunction() {};
emptyFunction.thatReturns = makeEmptyFunction;
emptyFunction.thatReturnsFalse = makeEmptyFunction(false);
emptyFunction.thatReturnsTrue = makeEmptyFunction(true);
emptyFunction.thatReturnsNull = makeEmptyFunction(null);
emptyFunction.thatReturnsThis = function () {
return this;
};
emptyFunction.thatReturnsArgument = function (arg) {
return arg;
};
module.exports = emptyFunction;
/***/ },
/* 89 */
/***/ function(module, exports) {
'use strict';
var uppercasePattern = /[A-Z]/g;
var msPattern = /^ms-/;
function hyphenateStyleName(string) {
return string
.replace(uppercasePattern, '-$&')
.toLowerCase()
.replace(msPattern, '-ms-');
}
module.exports = hyphenateStyleName;
/***/ },
/* 90 */
/***/ function(module, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = { "Webkit": { "transform": true, "transformOrigin": true, "transformOriginX": true, "transformOriginY": true, "backfaceVisibility": true, "perspective": true, "perspectiveOrigin": true, "transformStyle": true, "transformOriginZ": true, "animation": true, "animationDelay": true, "animationDirection": true, "animationFillMode": true, "animationDuration": true, "animationIterationCount": true, "animationName": true, "animationPlayState": true, "animationTimingFunction": true, "appearance": true, "userSelect": true, "fontKerning": true, "textEmphasisPosition": true, "textEmphasis": true, "textEmphasisStyle": true, "textEmphasisColor": true, "boxDecorationBreak": true, "clipPath": true, "maskImage": true, "maskMode": true, "maskRepeat": true, "maskPosition": true, "maskClip": true, "maskOrigin": true, "maskSize": true, "maskComposite": true, "mask": true, "maskBorderSource": true, "maskBorderMode": true, "maskBorderSlice": true, "maskBorderWidth": true, "maskBorderOutset": true, "maskBorderRepeat": true, "maskBorder": true, "maskType": true, "textDecorationStyle": true, "textDecorationSkip": true, "textDecorationLine": true, "textDecorationColor": true, "filter": true, "fontFeatureSettings": true, "breakAfter": true, "breakBefore": true, "breakInside": true, "columnCount": true, "columnFill": true, "columnGap": true, "columnRule": true, "columnRuleColor": true, "columnRuleStyle": true, "columnRuleWidth": true, "columns": true, "columnSpan": true, "columnWidth": true, "flex": true, "flexBasis": true, "flexDirection": true, "flexGrow": true, "flexFlow": true, "flexShrink": true, "flexWrap": true, "alignContent": true, "alignItems": true, "alignSelf": true, "justifyContent": true, "order": true, "transition": true, "transitionDelay": true, "transitionDuration": true, "transitionProperty": true, "transitionTimingFunction": true, "backdropFilter": true, "scrollSnapType": true, "scrollSnapPointsX": true, "scrollSnapPointsY": true, "scrollSnapDestination": true, "scrollSnapCoordinate": true, "shapeImageThreshold": true, "shapeImageMargin": true, "shapeImageOutside": true, "hyphens": true, "flowInto": true, "flowFrom": true, "regionFragment": true, "textSizeAdjust": true, "borderImage": true, "borderImageOutset": true, "borderImageRepeat": true, "borderImageSlice": true, "borderImageSource": true, "borderImageWidth": true, "tabSize": true, "objectFit": true, "objectPosition": true }, "Moz": { "appearance": true, "userSelect": true, "boxSizing": true, "textAlignLast": true, "textDecorationStyle": true, "textDecorationSkip": true, "textDecorationLine": true, "textDecorationColor": true, "tabSize": true, "hyphens": true, "fontFeatureSettings": true, "breakAfter": true, "breakBefore": true, "breakInside": true, "columnCount": true, "columnFill": true, "columnGap": true, "columnRule": true, "columnRuleColor": true, "columnRuleStyle": true, "columnRuleWidth": true, "columns": true, "columnSpan": true, "columnWidth": true }, "ms": { "flex": true, "flexBasis": false, "flexDirection": true, "flexGrow": false, "flexFlow": true, "flexShrink": false, "flexWrap": true, "alignContent": false, "alignItems": false, "alignSelf": false, "justifyContent": false, "order": false, "transform": true, "transformOrigin": true, "transformOriginX": true, "transformOriginY": true, "userSelect": true, "wrapFlow": true, "wrapThrough": true, "wrapMargin": true, "scrollSnapType": true, "scrollSnapPointsX": true, "scrollSnapPointsY": true, "scrollSnapDestination": true, "scrollSnapCoordinate": true, "touchAction": true, "hyphens": true, "flowInto": true, "flowFrom": true, "breakBefore": true, "breakAfter": true, "breakInside": true, "regionFragment": true, "gridTemplateColumns": true, "gridTemplateRows": true, "gridTemplateAreas": true, "gridTemplate": true, "gridAutoColumns": true, "gridAutoRows": true, "gridAutoFlow": true, "grid": true, "gridRowStart": true, "gridColumnStart": true, "gridRowEnd": true, "gridRow": true, "gridColumn": true, "gridColumnEnd": true, "gridColumnGap": true, "gridRowGap": true, "gridArea": true, "gridGap": true, "textSizeAdjust": true } };
module.exports = exports["default"];
/***/ },
/* 91 */
/***/ function(module, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
// light polyfill for Object.assign
exports.default = function (base) {
var extend = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
return Object.keys(extend).reduce(function (out, key) {
out[key] = extend[key];
return out;
}, base);
};
module.exports = exports["default"];
/***/ },
/* 92 */
/***/ function(module, exports, __webpack_require__) {
/**
* lodash 4.3.0 (Custom Build) <https://lodash.com/>
* Build: `lodash modularize exports="npm" -o ./`
* Copyright 2012-2016 The Dojo Foundation <http://dojofoundation.org/>
* Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>
* Copyright 2009-2016 Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
* Available under MIT license <https://lodash.com/license>
*/
var Stack = __webpack_require__(243),
baseClone = __webpack_require__(241),
isPlainObject = __webpack_require__(245),
keysIn = __webpack_require__(246),
rest = __webpack_require__(247);
/** Used as references for various `Number` constants. */
var MAX_SAFE_INTEGER = 9007199254740991;
/** `Object#toString` result references. */
var argsTag = '[object Arguments]',
arrayTag = '[object Array]',
boolTag = '[object Boolean]',
dateTag = '[object Date]',
errorTag = '[object Error]',
funcTag = '[object Function]',
genTag = '[object GeneratorFunction]',
mapTag = '[object Map]',
numberTag = '[object Number]',
objectTag = '[object Object]',
regexpTag = '[object RegExp]',
setTag = '[object Set]',
stringTag = '[object String]',
weakMapTag = '[object WeakMap]';
var arrayBufferTag = '[object ArrayBuffer]',
float32Tag = '[object Float32Array]',
float64Tag = '[object Float64Array]',
int8Tag = '[object Int8Array]',
int16Tag = '[object Int16Array]',
int32Tag = '[object Int32Array]',
uint8Tag = '[object Uint8Array]',
uint8ClampedTag = '[object Uint8ClampedArray]',
uint16Tag = '[object Uint16Array]',
uint32Tag = '[object Uint32Array]';
/** Used to detect unsigned integer values. */
var reIsUint = /^(?:0|[1-9]\d*)$/;
/** Used to identify `toStringTag` values of typed arrays. */
var typedArrayTags = {};
typedArrayTags[float32Tag] = typedArrayTags[float64Tag] =
typedArrayTags[int8Tag] = typedArrayTags[int16Tag] =
typedArrayTags[int32Tag] = typedArrayTags[uint8Tag] =
typedArrayTags[uint8ClampedTag] = typedArrayTags[uint16Tag] =
typedArrayTags[uint32Tag] = true;
typedArrayTags[argsTag] = typedArrayTags[arrayTag] =
typedArrayTags[arrayBufferTag] = typedArrayTags[boolTag] =
typedArrayTags[dateTag] = typedArrayTags[errorTag] =
typedArrayTags[funcTag] = typedArrayTags[mapTag] =
typedArrayTags[numberTag] = typedArrayTags[objectTag] =
typedArrayTags[regexpTag] = typedArrayTags[setTag] =
typedArrayTags[stringTag] = typedArrayTags[weakMapTag] = false;
/**
* A specialized version of `_.forEach` for arrays without support for
* iteratee shorthands.
*
* @private
* @param {Array} array The array to iterate over.
* @param {Function} iteratee The function invoked per iteration.
* @returns {Array} Returns `array`.
*/
function arrayEach(array, iteratee) {
var index = -1,
length = array.length;
while (++index < length) {
if (iteratee(array[index], index, array) === false) {
break;
}
}
return array;
}
/**
* Checks if `value` is a valid array-like index.
*
* @private
* @param {*} value The value to check.
* @param {number} [length=MAX_SAFE_INTEGER] The upper bounds of a valid index.
* @returns {boolean} Returns `true` if `value` is a valid index, else `false`.
*/
function isIndex(value, length) {
value = (typeof value == 'number' || reIsUint.test(value)) ? +value : -1;
length = length == null ? MAX_SAFE_INTEGER : length;
return value > -1 && value % 1 == 0 && value < length;
}
/** Used for built-in method references. */
var objectProto = Object.prototype;
/** Used to check objects for own properties. */
var hasOwnProperty = objectProto.hasOwnProperty;
/**
* Used to resolve the [`toStringTag`](http://ecma-international.org/ecma-262/6.0/#sec-object.prototype.tostring)
* of values.
*/
var objectToString = objectProto.toString;
/** Built-in value references. */
var propertyIsEnumerable = objectProto.propertyIsEnumerable;
/**
* This function is like `assignValue` except that it doesn't assign `undefined` values.
*
* @private
* @param {Object} object The object to modify.
* @param {string} key The key of the property to assign.
* @param {*} value The value to assign.
*/
function assignMergeValue(object, key, value) {
if ((value !== undefined && !eq(object[key], value)) ||
(typeof key == 'number' && value === undefined && !(key in object))) {
object[key] = value;
}
}
/**
* Assigns `value` to `key` of `object` if the existing value is not equivalent
* using [`SameValueZero`](http://ecma-international.org/ecma-262/6.0/#sec-samevaluezero)
* for equality comparisons.
*
* @private
* @param {Object} object The object to modify.
* @param {string} key The key of the property to assign.
* @param {*} value The value to assign.
*/
function assignValue(object, key, value) {
var objValue = object[key];
if ((!eq(objValue, value) ||
(eq(objValue, objectProto[key]) && !hasOwnProperty.call(object, key))) ||
(value === undefined && !(key in object))) {
object[key] = value;
}
}
/**
* The base implementation of `_.merge` without support for multiple sources.
*
* @private
* @param {Object} object The destination object.
* @param {Object} source The source object.
* @param {number} srcIndex The index of `source`.
* @param {Function} [customizer] The function to customize merged values.
* @param {Object} [stack] Tracks traversed source values and their merged counterparts.
*/
function baseMerge(object, source, srcIndex, customizer, stack) {
if (object === source) {
return;
}
var props = (isArray(source) || isTypedArray(source))
? undefined
: keysIn(source);
arrayEach(props || source, function(srcValue, key) {
if (props) {
key = srcValue;
srcValue = source[key];
}
if (isObject(srcValue)) {
stack || (stack = new Stack);
baseMergeDeep(object, source, key, srcIndex, baseMerge, customizer, stack);
}
else {
var newValue = customizer
? customizer(object[key], srcValue, (key + ''), object, source, stack)
: undefined;
if (newValue === undefined) {
newValue = srcValue;
}
assignMergeValue(object, key, newValue);
}
});
}
/**
* A specialized version of `baseMerge` for arrays and objects which performs
* deep merges and tracks traversed objects enabling objects with circular
* references to be merged.
*
* @private
* @param {Object} object The destination object.
* @param {Object} source The source object.
* @param {string} key The key of the value to merge.
* @param {number} srcIndex The index of `source`.
* @param {Function} mergeFunc The function to merge values.
* @param {Function} [customizer] The function to customize assigned values.
* @param {Object} [stack] Tracks traversed source values and their merged counterparts.
*/
function baseMergeDeep(object, source, key, srcIndex, mergeFunc, customizer, stack) {
var objValue = object[key],
srcValue = source[key],
stacked = stack.get(srcValue);
if (stacked) {
assignMergeValue(object, key, stacked);
return;
}
var newValue = customizer
? customizer(objValue, srcValue, (key + ''), object, source, stack)
: undefined;
var isCommon = newValue === undefined;
if (isCommon) {
newValue = srcValue;
if (isArray(srcValue) || isTypedArray(srcValue)) {
if (isArray(objValue)) {
newValue = objValue;
}
else if (isArrayLikeObject(objValue)) {
newValue = copyArray(objValue);
}
else {
isCommon = false;
newValue = baseClone(srcValue, true);
}
}
else if (isPlainObject(srcValue) || isArguments(srcValue)) {
if (isArguments(objValue)) {
newValue = toPlainObject(objValue);
}
else if (!isObject(objValue) || (srcIndex && isFunction(objValue))) {
isCommon = false;
newValue = baseClone(srcValue, true);
}
else {
newValue = objValue;
}
}
else {
isCommon = false;
}
}
stack.set(srcValue, newValue);
if (isCommon) {
// Recursively merge objects and arrays (susceptible to call stack limits).
mergeFunc(newValue, srcValue, srcIndex, customizer, stack);
}
assignMergeValue(object, key, newValue);
}
/**
* The base implementation of `_.property` without support for deep paths.
*
* @private
* @param {string} key The key of the property to get.
* @returns {Function} Returns the new function.
*/
function baseProperty(key) {
return function(object) {
return object == null ? undefined : object[key];
};
}
/**
* Copies the values of `source` to `array`.
*
* @private
* @param {Array} source The array to copy values from.
* @param {Array} [array=[]] The array to copy values to.
* @returns {Array} Returns `array`.
*/
function copyArray(source, array) {
var index = -1,
length = source.length;
array || (array = Array(length));
while (++index < length) {
array[index] = source[index];
}
return array;
}
/**
* Copies properties of `source` to `object`.
*
* @private
* @param {Object} source The object to copy properties from.
* @param {Array} props The property names to copy.
* @param {Object} [object={}] The object to copy properties to.
* @returns {Object} Returns `object`.
*/
function copyObject(source, props, object) {
return copyObjectWith(source, props, object);
}
/**
* This function is like `copyObject` except that it accepts a function to
* customize copied values.
*
* @private
* @param {Object} source The object to copy properties from.
* @param {Array} props The property names to copy.
* @param {Object} [object={}] The object to copy properties to.
* @param {Function} [customizer] The function to customize copied values.
* @returns {Object} Returns `object`.
*/
function copyObjectWith(source, props, object, customizer) {
object || (object = {});
var index = -1,
length = props.length;
while (++index < length) {
var key = props[index];
var newValue = customizer
? customizer(object[key], source[key], key, object, source)
: source[key];
assignValue(object, key, newValue);
}
return object;
}
/**
* Creates a function like `_.assign`.
*
* @private
* @param {Function} assigner The function to assign values.
* @returns {Function} Returns the new assigner function.
*/
function createAssigner(assigner) {
return rest(function(object, sources) {
var index = -1,
length = sources.length,
customizer = length > 1 ? sources[length - 1] : undefined,
guard = length > 2 ? sources[2] : undefined;
customizer = typeof customizer == 'function'
? (length--, customizer)
: undefined;
if (guard && isIterateeCall(sources[0], sources[1], guard)) {
customizer = length < 3 ? undefined : customizer;
length = 1;
}
object = Object(object);
while (++index < length) {
var source = sources[index];
if (source) {
assigner(object, source, index, customizer);
}
}
return object;
});
}
/**
* Gets the "length" property value of `object`.
*
* **Note:** This function is used to avoid a [JIT bug](https://bugs.webkit.org/show_bug.cgi?id=142792)
* that affects Safari on at least iOS 8.1-8.3 ARM64.
*
* @private
* @param {Object} object The object to query.
* @returns {*} Returns the "length" value.
*/
var getLength = baseProperty('length');
/**
* Checks if the given arguments are from an iteratee call.
*
* @private
* @param {*} value The potential iteratee value argument.
* @param {*} index The potential iteratee index or key argument.
* @param {*} object The potential iteratee object argument.
* @returns {boolean} Returns `true` if the arguments are from an iteratee call, else `false`.
*/
function isIterateeCall(value, index, object) {
if (!isObject(object)) {
return false;
}
var type = typeof index;
if (type == 'number'
? (isArrayLike(object) && isIndex(index, object.length))
: (type == 'string' && index in object)) {
return eq(object[index], value);
}
return false;
}
/**
* Performs a [`SameValueZero`](http://ecma-international.org/ecma-262/6.0/#sec-samevaluezero)
* comparison between two values to determine if they are equivalent.
*
* @static
* @memberOf _
* @category Lang
* @param {*} value The value to compare.
* @param {*} other The other value to compare.
* @returns {boolean} Returns `true` if the values are equivalent, else `false`.
* @example
*
* var object = { 'user': 'fred' };
* var other = { 'user': 'fred' };
*
* _.eq(object, object);
* // => true
*
* _.eq(object, other);
* // => false
*
* _.eq('a', 'a');
* // => true
*
* _.eq('a', Object('a'));
* // => false
*
* _.eq(NaN, NaN);
* // => true
*/
function eq(value, other) {
return value === other || (value !== value && other !== other);
}
/**
* Checks if `value` is likely an `arguments` object.
*
* @static
* @memberOf _
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is correctly classified, else `false`.
* @example
*
* _.isArguments(function() { return arguments; }());
* // => true
*
* _.isArguments([1, 2, 3]);
* // => false
*/
function isArguments(value) {
// Safari 8.1 incorrectly makes `arguments.callee` enumerable in strict mode.
return isArrayLikeObject(value) && hasOwnProperty.call(value, 'callee') &&
(!propertyIsEnumerable.call(value, 'callee') || objectToString.call(value) == argsTag);
}
/**
* Checks if `value` is classified as an `Array` object.
*
* @static
* @memberOf _
* @type {Function}
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is correctly classified, else `false`.
* @example
*
* _.isArray([1, 2, 3]);
* // => true
*
* _.isArray(document.body.children);
* // => false
*
* _.isArray('abc');
* // => false
*
* _.isArray(_.noop);
* // => false
*/
var isArray = Array.isArray;
/**
* Checks if `value` is array-like. A value is considered array-like if it's
* not a function and has a `value.length` that's an integer greater than or
* equal to `0` and less than or equal to `Number.MAX_SAFE_INTEGER`.
*
* @static
* @memberOf _
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is array-like, else `false`.
* @example
*
* _.isArrayLike([1, 2, 3]);
* // => true
*
* _.isArrayLike(document.body.children);
* // => true
*
* _.isArrayLike('abc');
* // => true
*
* _.isArrayLike(_.noop);
* // => false
*/
function isArrayLike(value) {
return value != null &&
!(typeof value == 'function' && isFunction(value)) && isLength(getLength(value));
}
/**
* This method is like `_.isArrayLike` except that it also checks if `value`
* is an object.
*
* @static
* @memberOf _
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is an array-like object, else `false`.
* @example
*
* _.isArrayLikeObject([1, 2, 3]);
* // => true
*
* _.isArrayLikeObject(document.body.children);
* // => true
*
* _.isArrayLikeObject('abc');
* // => false
*
* _.isArrayLikeObject(_.noop);
* // => false
*/
function isArrayLikeObject(value) {
return isObjectLike(value) && isArrayLike(value);
}
/**
* Checks if `value` is classified as a `Function` object.
*
* @static
* @memberOf _
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is correctly classified, else `false`.
* @example
*
* _.isFunction(_);
* // => true
*
* _.isFunction(/abc/);
* // => false
*/
function isFunction(value) {
// The use of `Object#toString` avoids issues with the `typeof` operator
// in Safari 8 which returns 'object' for typed array constructors, and
// PhantomJS 1.9 which returns 'function' for `NodeList` instances.
var tag = isObject(value) ? objectToString.call(value) : '';
return tag == funcTag || tag == genTag;
}
/**
* Checks if `value` is a valid array-like length.
*
* **Note:** This function is loosely based on [`ToLength`](http://ecma-international.org/ecma-262/6.0/#sec-tolength).
*
* @static
* @memberOf _
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is a valid length, else `false`.
* @example
*
* _.isLength(3);
* // => true
*
* _.isLength(Number.MIN_VALUE);
* // => false
*
* _.isLength(Infinity);
* // => false
*
* _.isLength('3');
* // => false
*/
function isLength(value) {
return typeof value == 'number' &&
value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;
}
/**
* Checks if `value` is the [language type](https://es5.github.io/#x8) of `Object`.
* (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
*
* @static
* @memberOf _
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is an object, else `false`.
* @example
*
* _.isObject({});
* // => true
*
* _.isObject([1, 2, 3]);
* // => true
*
* _.isObject(_.noop);
* // => true
*
* _.isObject(null);
* // => false
*/
function isObject(value) {
var type = typeof value;
return !!value && (type == 'object' || type == 'function');
}
/**
* Checks if `value` is object-like. A value is object-like if it's not `null`
* and has a `typeof` result of "object".
*
* @static
* @memberOf _
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is object-like, else `false`.
* @example
*
* _.isObjectLike({});
* // => true
*
* _.isObjectLike([1, 2, 3]);
* // => true
*
* _.isObjectLike(_.noop);
* // => false
*
* _.isObjectLike(null);
* // => false
*/
function isObjectLike(value) {
return !!value && typeof value == 'object';
}
/**
* Checks if `value` is classified as a typed array.
*
* @static
* @memberOf _
* @category Lang
* @param {*} value The value to check.
* @returns {boolean} Returns `true` if `value` is correctly classified, else `false`.
* @example
*
* _.isTypedArray(new Uint8Array);
* // => true
*
* _.isTypedArray([]);
* // => false
*/
function isTypedArray(value) {
return isObjectLike(value) &&
isLength(value.length) && !!typedArrayTags[objectToString.call(value)];
}
/**
* Converts `value` to a plain object flattening inherited enumerable
* properties of `value` to own properties of the plain object.
*
* @static
* @memberOf _
* @category Lang
* @param {*} value The value to convert.
* @returns {Object} Returns the converted plain object.
* @example
*
* function Foo() {
* this.b = 2;
* }
*
* Foo.prototype.c = 3;
*
* _.assign({ 'a': 1 }, new Foo);
* // => { 'a': 1, 'b': 2 }
*
* _.assign({ 'a': 1 }, _.toPlainObject(new Foo));
* // => { 'a': 1, 'b': 2, 'c': 3 }
*/
function toPlainObject(value) {
return copyObject(value, keysIn(value));
}
/**
* Recursively merges own and inherited enumerable properties of source objects
* into the destination object. Source properties that resolve to `undefined`
* are skipped if a destination value exists. Array and plain object properties
* are merged recursively. Other objects and value types are overridden by
* assignment. Source objects are applied from left to right. Subsequent
* sources overwrite property assignments of previous sources.
*
* **Note:** This method mutates `object`.
*
* @static
* @memberOf _
* @category Object
* @param {Object} object The destination object.
* @param {...Object} [sources] The source objects.
* @returns {Object} Returns `object`.
* @example
*
* var users = {
* 'data': [{ 'user': 'barney' }, { 'user': 'fred' }]
* };
*
* var ages = {
* 'data': [{ 'age': 36 }, { 'age': 40 }]
* };
*
* _.merge(users, ages);
* // => { 'data': [{ 'user': 'barney', 'age': 36 }, { 'user': 'fred', 'age': 40 }] }
*/
var merge = createAssigner(function(object, source, srcIndex) {
baseMerge(object, source, srcIndex);
});
module.exports = merge;
/***/ },
/* 93 */
/***/ function(module, exports, __webpack_require__) {
/**
* Copyright 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule EventPluginHub
*/
'use strict';
var _prodInvariant = __webpack_require__(25);
var EventPluginRegistry = __webpack_require__(256);
var EventPluginUtils = __webpack_require__(51);
var ReactErrorUtils = __webpack_require__(94);
var accumulateInto = __webpack_require__(95);
var forEachAccumulated = __webpack_require__(96);
var invariant = __webpack_require__(19);
/**
* Internal store for event listeners
*/
var listenerBank = {};
/**
* Internal queue of events that have accumulated their dispatches and are
* waiting to have their dispatches executed.
*/
var eventQueue = null;
/**
* Dispatches an event and releases it back into the pool, unless persistent.
*
* @param {?object} event Synthetic event to be dispatched.
* @param {boolean} simulated If the event is simulated (changes exn behavior)
* @private
*/
var executeDispatchesAndRelease = function (event, simulated) {
if (event) {
EventPluginUtils.executeDispatchesInOrder(event, simulated);
if (!event.isPersistent()) {
event.constructor.release(event);
}
}
};
var executeDispatchesAndReleaseSimulated = function (e) {
return executeDispatchesAndRelease(e, true);
};
var executeDispatchesAndReleaseTopLevel = function (e) {
return executeDispatchesAndRelease(e, false);
};
/**
* This is a unified interface for event plugins to be installed and configured.
*
* Event plugins can implement the following properties:
*
* `extractEvents` {function(string, DOMEventTarget, string, object): *}
* Required. When a top-level event is fired, this method is expected to
* extract synthetic events that will in turn be queued and dispatched.
*
* `eventTypes` {object}
* Optional, plugins that fire events must publish a mapping of registration
* names that are used to register listeners. Values of this mapping must
* be objects that contain `registrationName` or `phasedRegistrationNames`.
*
* `executeDispatch` {function(object, function, string)}
* Optional, allows plugins to override how an event gets dispatched. By
* default, the listener is simply invoked.
*
* Each plugin that is injected into `EventsPluginHub` is immediately operable.
*
* @public
*/
var EventPluginHub = {
/**
* Methods for injecting dependencies.
*/
injection: {
/**
* @param {array} InjectedEventPluginOrder
* @public
*/
injectEventPluginOrder: EventPluginRegistry.injectEventPluginOrder,
/**
* @param {object} injectedNamesToPlugins Map from names to plugin modules.
*/
injectEventPluginsByName: EventPluginRegistry.injectEventPluginsByName
},
/**
* Stores `listener` at `listenerBank[registrationName][id]`. Is idempotent.
*
* @param {object} inst The instance, which is the source of events.
* @param {string} registrationName Name of listener (e.g. `onClick`).
* @param {function} listener The callback to store.
*/
putListener: function (inst, registrationName, listener) {
!(typeof listener === 'function') ? true ? invariant(false, 'Expected %s listener to be a function, instead got type %s', registrationName, typeof listener) : _prodInvariant('94', registrationName, typeof listener) : void 0;
var bankForRegistrationName = listenerBank[registrationName] || (listenerBank[registrationName] = {});
bankForRegistrationName[inst._rootNodeID] = listener;
var PluginModule = EventPluginRegistry.registrationNameModules[registrationName];
if (PluginModule && PluginModule.didPutListener) {
PluginModule.didPutListener(inst, registrationName, listener);
}
},
/**
* @param {object} inst The instance, which is the source of events.
* @param {string} registrationName Name of listener (e.g. `onClick`).
* @return {?function} The stored callback.
*/
getListener: function (inst, registrationName) {
var bankForRegistrationName = listenerBank[registrationName];
return bankForRegistrationName && bankForRegistrationName[inst._rootNodeID];
},
/**
* Deletes a listener from the registration bank.
*
* @param {object} inst The instance, which is the source of events.
* @param {string} registrationName Name of listener (e.g. `onClick`).
*/
deleteListener: function (inst, registrationName) {
var PluginModule = EventPluginRegistry.registrationNameModules[registrationName];
if (PluginModule && PluginModule.willDeleteListener) {
PluginModule.willDeleteListener(inst, registrationName);
}
var bankForRegistrationName = listenerBank[registrationName];
// TODO: This should never be null -- when is it?
if (bankForRegistrationName) {
delete bankForRegistrationName[inst._rootNodeID];
}
},
/**
* Deletes all listeners for the DOM element with the supplied ID.
*
* @param {object} inst The instance, which is the source of events.
*/
deleteAllListeners: function (inst) {
for (var registrationName in listenerBank) {
if (!listenerBank.hasOwnProperty(registrationName)) {
continue;
}
if (!listenerBank[registrationName][inst._rootNodeID]) {
continue;
}
var PluginModule = EventPluginRegistry.registrationNameModules[registrationName];
if (PluginModule && PluginModule.willDeleteListener) {
PluginModule.willDeleteListener(inst, registrationName);
}
delete listenerBank[registrationName][inst._rootNodeID];
}
},
/**
* Allows registered plugins an opportunity to extract events from top-level
* native browser events.
*
* @return {*} An accumulation of synthetic events.
* @internal
*/
extractEvents: function (topLevelType, targetInst, nativeEvent, nativeEventTarget) {
var events;
var plugins = EventPluginRegistry.plugins;
for (var i = 0; i < plugins.length; i++) {
// Not every plugin in the ordering may be loaded at runtime.
var possiblePlugin = plugins[i];
if (possiblePlugin) {
var extractedEvents = possiblePlugin.extractEvents(topLevelType, targetInst, nativeEvent, nativeEventTarget);
if (extractedEvents) {
events = accumulateInto(events, extractedEvents);
}
}
}
return events;
},
/**
* Enqueues a synthetic event that should be dispatched when
* `processEventQueue` is invoked.
*
* @param {*} events An accumulation of synthetic events.
* @internal
*/
enqueueEvents: function (events) {
if (events) {
eventQueue = accumulateInto(eventQueue, events);
}
},
/**
* Dispatches all synthetic events on the event queue.
*
* @internal
*/
processEventQueue: function (simulated) {
// Set `eventQueue` to null before processing it so that we can tell if more
// events get enqueued while processing.
var processingEventQueue = eventQueue;
eventQueue = null;
if (simulated) {
forEachAccumulated(processingEventQueue, executeDispatchesAndReleaseSimulated);
} else {
forEachAccumulated(processingEventQueue, executeDispatchesAndReleaseTopLevel);
}
!!eventQueue ? true ? invariant(false, 'processEventQueue(): Additional events were enqueued while processing an event queue. Support for this has not yet been implemented.') : _prodInvariant('95') : void 0;
// This would be a good time to rethrow if any of the event handlers threw.
ReactErrorUtils.rethrowCaughtError();
},
/**
* These are needed for tests only. Do not use!
*/
__purge: function () {
listenerBank = {};
},
__getListenerBank: function () {
return listenerBank;
}
};
module.exports = EventPluginHub;
/***/ },
/* 94 */
/***/ function(module, exports, __webpack_require__) {
/**
* Copyright 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule ReactErrorUtils
*/
'use strict';
var caughtError = null;
/**
* Call a function while guarding against errors that happens within it.
*
* @param {?String} name of the guard to use for logging or debugging
* @param {Function} func The function to invoke
* @param {*} a First argument
* @param {*} b Second argument
*/
function invokeGuardedCallback(name, func, a, b) {
try {
return func(a, b);
} catch (x) {
if (caughtError === null) {
caughtError = x;
}
return undefined;
}
}
var ReactErrorUtils = {
invokeGuardedCallback: invokeGuardedCallback,
/**
* Invoked by ReactTestUtils.Simulate so that any errors thrown by the event
* handler are sure to be rethrown by rethrowCaughtError.
*/
invokeGuardedCallbackWithCatch: invokeGuardedCallback,
/**
* During execution of guarded functions we will capture the first error which
* we will rethrow to be handled by the top level error handler.
*/
rethrowCaughtError: function () {
if (caughtError) {
var error = caughtError;
caughtError = null;
throw error;
}
}
};
if (true) {
/**
* To help development we can get better devtools integration by simulating a
* real browser event.
*/
if (typeof window !== 'undefined' && typeof window.dispatchEvent === 'function' && typeof document !== 'undefined' && typeof document.createEvent === 'function') {
var fakeNode = document.createElement('react');
ReactErrorUtils.invokeGuardedCallback = function (name, func, a, b) {
var boundFunc = func.bind(null, a, b);
var evtType = 'react-' + name;
fakeNode.addEventListener(evtType, boundFunc, false);
var evt = document.createEvent('Event');
evt.initEvent(evtType, false, false);
fakeNode.dispatchEvent(evt);
fakeNode.removeEventListener(evtType, boundFunc, false);
};
}
}
module.exports = ReactErrorUtils;
/***/ },
/* 95 */
/***/ function(module, exports, __webpack_require__) {
/**
* Copyright 2014-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule accumulateInto
*/
'use strict';
var _prodInvariant = __webpack_require__(25);
var invariant = __webpack_require__(19);
/**
*
* Accumulates items that must not be null or undefined into the first one. This
* is used to conserve memory by avoiding array allocations, and thus sacrifices
* API cleanness. Since `current` can be null before being passed in and not
* null after this function, make sure to assign it back to `current`:
*
* `a = accumulateInto(a, b);`
*
* This API should be sparingly used. Try `accumulate` for something cleaner.
*
* @return {*|array<*>} An accumulation of items.
*/
function accumulateInto(current, next) {
!(next != null) ? true ? invariant(false, 'accumulateInto(...): Accumulated items must not be null or undefined.') : _prodInvariant('30') : void 0;
if (current == null) {
return next;
}
// Both are not empty. Warning: Never call x.concat(y) when you are not
// certain that x is an Array (x could be a string with concat method).
var currentIsArray = Array.isArray(current);
var nextIsArray = Array.isArray(next);
if (currentIsArray && nextIsArray) {
current.push.apply(current, next);
return current;
}
if (currentIsArray) {
current.push(next);
return current;
}
if (nextIsArray) {
// A bit too dangerous to mutate `next`.
return [current].concat(next);
}
return [current, next];
}
module.exports = accumulateInto;
/***/ },
/* 96 */
/***/ function(module, exports) {
/**
* Copyright 2013-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* @providesModule forEachAccumulated
*/
'use strict';
/**
* @param {array} arr an "accumulation" of items which is either an Array or
* a single item. Useful when paired with the `accumulate` module. This is a
* simple utility that allows us to reason about a collection of items, but
* handling the case when there is exactly one item (and we do not need to
* allocate an array).
*/
var forEachAccumulated = function (arr, cb, scope) {
if (Array.isArray(arr)) {
arr.forEach(cb, scope);
} else if (arr) {
cb.call(scope, arr);
}
};
module.exports = forEachAccumulated;
/***/ },
/* 97 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
exports.__esModule = true;
var createHelper = function createHelper(func, helperName) {
var setDisplayName = arguments.length <= 2 || arguments[2] === undefined ? true : arguments[2];
var noArgs = arguments.length <= 3 || arguments[3] === undefined ? false : arguments[3];
if (("development") !== 'production' && setDisplayName) {
var _ret = function () {
/* eslint-disable global-require */
var wrapDisplayName = __webpack_require__(271).default;
/* eslint-enable global-require */
if (noArgs) {
return {
v: function v(BaseComponent) {
var Component = func(BaseComponent);
Component.displayName = wrapDisplayName(BaseComponent, helperName);
return Component;
}
};
}
return {
v: function v() {
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
if (args.length > func.length) {
/* eslint-disable */
console.error(
/* eslint-enable */
'Too many arguments passed to ' + helperName + '(). It should called ' + ('like so: ' + helperName + '(...args)(BaseComponent).'));
}
return function (BaseComponent) {
var Component = func.apply(undefined, args)(BaseComponent);
Component.displayName = wrapDisplayName(BaseComponent, helperName);
return Component;
};
}
};
}();
if (typeof _ret === "object") return _ret.v;
}
return func;
};
exports.default = createHelper;
/***/ },
/* 98 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _IconButton = __webpack_require__(20);
var _IconButton2 = _interopRequireDefault(_IconButton);
var _menu = __webpack_require__(206);
var _menu2 = _interopRequireDefault(_menu);
var _Paper = __webpack_require__(8);
var _Paper2 = _interopRequireDefault(_Paper);
var _propTypes = __webpack_require__(9);
var _propTypes2 = _interopRequireDefault(_propTypes);
var _warning = __webpack_require__(6);
var _warning2 = _interopRequireDefault(_warning);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var _context$muiTheme = context.muiTheme;
var appBar = _context$muiTheme.appBar;
var iconButtonSize = _context$muiTheme.button.iconButtonSize;
var zIndex = _context$muiTheme.zIndex;
var flatButtonSize = 36;
var styles = {
root: {
position: 'relative',
zIndex: zIndex.appBar,
width: '100%',
display: 'flex',
backgroundColor: appBar.color,
paddingLeft: appBar.padding,
paddingRight: appBar.padding
},
title: {
whiteSpace: 'nowrap',
overflow: 'hidden',
textOverflow: 'ellipsis',
margin: 0,
paddingTop: 0,
letterSpacing: 0,
fontSize: 24,
fontWeight: appBar.titleFontWeight,
color: appBar.textColor,
height: appBar.height,
lineHeight: appBar.height + 'px'
},
mainElement: {
boxFlex: 1,
flex: '1'
},
iconButtonStyle: {
marginTop: (appBar.height - iconButtonSize) / 2,
marginRight: 8,
marginLeft: -16
},
iconButtonIconStyle: {
fill: appBar.textColor,
color: appBar.textColor
},
flatButton: {
color: appBar.textColor,
marginTop: (iconButtonSize - flatButtonSize) / 2 + 1
}
};
return styles;
}
var AppBar = function (_Component) {
_inherits(AppBar, _Component);
function AppBar() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, AppBar);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(AppBar)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.handleTouchTapLeftIconButton = function (event) {
if (_this.props.onLeftIconButtonTouchTap) {
_this.props.onLeftIconButtonTouchTap(event);
}
}, _this.handleTouchTapRightIconButton = function (event) {
if (_this.props.onRightIconButtonTouchTap) {
_this.props.onRightIconButtonTouchTap(event);
}
}, _this.handleTitleTouchTap = function (event) {
if (_this.props.onTitleTouchTap) {
_this.props.onTitleTouchTap(event);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(AppBar, [{
key: 'componentDidMount',
value: function componentDidMount() {
true ? (0, _warning2.default)(!this.props.iconElementLeft || !this.props.iconClassNameLeft, 'Properties iconElementLeft\n and iconClassNameLeft cannot be simultaneously defined. Please use one or the other.') : void 0;
true ? (0, _warning2.default)(!this.props.iconElementRight || !this.props.iconClassNameRight, 'Properties iconElementRight\n and iconClassNameRight cannot be simultaneously defined. Please use one or the other.') : void 0;
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var title = _props.title;
var titleStyle = _props.titleStyle;
var iconStyleRight = _props.iconStyleRight;
var showMenuIconButton = _props.showMenuIconButton;
var iconElementLeft = _props.iconElementLeft;
var iconElementRight = _props.iconElementRight;
var iconClassNameLeft = _props.iconClassNameLeft;
var iconClassNameRight = _props.iconClassNameRight;
var className = _props.className;
var style = _props.style;
var zDepth = _props.zDepth;
var children = _props.children;
var other = _objectWithoutProperties(_props, ['title', 'titleStyle', 'iconStyleRight', 'showMenuIconButton', 'iconElementLeft', 'iconElementRight', 'iconClassNameLeft', 'iconClassNameRight', 'className', 'style', 'zDepth', 'children']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var menuElementLeft = void 0;
var menuElementRight = void 0;
// If the title is a string, wrap in an h1 tag.
// If not, wrap in a div tag.
var titleComponent = typeof title === 'string' || title instanceof String ? 'h1' : 'div';
var titleElement = _react2.default.createElement(titleComponent, {
onTouchTap: this.handleTitleTouchTap,
style: prepareStyles((0, _simpleAssign2.default)(styles.title, styles.mainElement, titleStyle))
}, title);
if (showMenuIconButton) {
var iconElementLeftNode = iconElementLeft;
if (iconElementLeft) {
if (iconElementLeft.type.muiName === 'IconButton') {
iconElementLeftNode = _react2.default.cloneElement(iconElementLeft, {
iconStyle: (0, _simpleAssign2.default)({}, styles.iconButtonIconStyle, iconElementLeft.props.iconStyle)
});
}
menuElementLeft = _react2.default.createElement(
'div',
{ style: prepareStyles((0, _simpleAssign2.default)({}, styles.iconButtonStyle)) },
iconElementLeftNode
);
} else {
var child = iconClassNameLeft ? '' : _react2.default.createElement(_menu2.default, { style: (0, _simpleAssign2.default)({}, styles.iconButtonIconStyle) });
menuElementLeft = _react2.default.createElement(
_IconButton2.default,
{
style: styles.iconButtonStyle,
iconStyle: styles.iconButtonIconStyle,
iconClassName: iconClassNameLeft,
onTouchTap: this.handleTouchTapLeftIconButton
},
child
);
}
}
var iconRightStyle = (0, _simpleAssign2.default)({}, styles.iconButtonStyle, {
marginRight: -16,
marginLeft: 'auto'
}, iconStyleRight);
if (iconElementRight) {
var iconElementRightNode = iconElementRight;
switch (iconElementRight.type.muiName) {
case 'IconMenu':
case 'IconButton':
iconElementRightNode = _react2.default.cloneElement(iconElementRight, {
iconStyle: (0, _simpleAssign2.default)({}, styles.iconButtonIconStyle, iconElementRight.props.iconStyle)
});
break;
case 'FlatButton':
iconElementRightNode = _react2.default.cloneElement(iconElementRight, {
style: (0, _simpleAssign2.default)({}, styles.flatButton, iconElementRight.props.style)
});
break;
default:
}
menuElementRight = _react2.default.createElement(
'div',
{ style: prepareStyles(iconRightStyle) },
iconElementRightNode
);
} else if (iconClassNameRight) {
menuElementRight = _react2.default.createElement(_IconButton2.default, {
style: iconRightStyle,
iconStyle: styles.iconButtonIconStyle,
iconClassName: iconClassNameRight,
onTouchTap: this.handleTouchTapRightIconButton
});
}
return _react2.default.createElement(
_Paper2.default,
_extends({}, other, {
rounded: false,
className: className,
style: (0, _simpleAssign2.default)({}, styles.root, style),
zDepth: zDepth
}),
menuElementLeft,
titleElement,
menuElementRight,
children
);
}
}]);
return AppBar;
}(_react.Component);
AppBar.muiName = 'AppBar';
AppBar.propTypes = {
/**
* Can be used to render a tab inside an app bar for instance.
*/
children: _react.PropTypes.node,
/**
* Applied to the app bar's root element.
*/
className: _react.PropTypes.string,
/**
* The classname of the icon on the left of the app bar.
* If you are using a stylesheet for your icons, enter the class name for the icon to be used here.
*/
iconClassNameLeft: _react.PropTypes.string,
/**
* Similiar to the iconClassNameLeft prop except that
* it applies to the icon displayed on the right of the app bar.
*/
iconClassNameRight: _react.PropTypes.string,
/**
* The custom element to be displayed on the left side of the
* app bar such as an SvgIcon.
*/
iconElementLeft: _react.PropTypes.element,
/**
* Similiar to the iconElementLeft prop except that this element is displayed on the right of the app bar.
*/
iconElementRight: _react.PropTypes.element,
/**
* Override the inline-styles of the element displayed on the right side of the app bar.
*/
iconStyleRight: _react.PropTypes.object,
/**
* Callback function for when the left icon is selected via a touch tap.
*
* @param {object} event TouchTap event targeting the left `IconButton`.
*/
onLeftIconButtonTouchTap: _react.PropTypes.func,
/**
* Callback function for when the right icon is selected via a touch tap.
*
* @param {object} event TouchTap event targeting the right `IconButton`.
*/
onRightIconButtonTouchTap: _react.PropTypes.func,
/**
* Callback function for when the title text is selected via a touch tap.
*
* @param {object} event TouchTap event targeting the `title` node.
*/
onTitleTouchTap: _react.PropTypes.func,
/**
* Determines whether or not to display the Menu icon next to the title.
* Setting this prop to false will hide the icon.
*/
showMenuIconButton: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The title to display on the app bar.
*/
title: _react.PropTypes.node,
/**
* Override the inline-styles of the app bar's title element.
*/
titleStyle: _react.PropTypes.object,
/**
* The zDepth of the component.
* The shadow of the app bar is also dependent on this property.
*/
zDepth: _propTypes2.default.zDepth
};
AppBar.defaultProps = {
showMenuIconButton: true,
title: '',
zDepth: 1
};
AppBar.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = AppBar;
/***/ },
/* 99 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _AppBar = __webpack_require__(98);
var _AppBar2 = _interopRequireDefault(_AppBar);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _AppBar2.default;
/***/ },
/* 100 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol ? "symbol" : typeof obj; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactDom = __webpack_require__(4);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _keycode = __webpack_require__(10);
var _keycode2 = _interopRequireDefault(_keycode);
var _TextField = __webpack_require__(21);
var _TextField2 = _interopRequireDefault(_TextField);
var _Menu = __webpack_require__(64);
var _Menu2 = _interopRequireDefault(_Menu);
var _MenuItem = __webpack_require__(38);
var _MenuItem2 = _interopRequireDefault(_MenuItem);
var _Divider = __webpack_require__(60);
var _Divider2 = _interopRequireDefault(_Divider);
var _Popover = __webpack_require__(18);
var _Popover2 = _interopRequireDefault(_Popover);
var _propTypes = __webpack_require__(9);
var _propTypes2 = _interopRequireDefault(_propTypes);
var _warning = __webpack_require__(6);
var _warning2 = _interopRequireDefault(_warning);
var _deprecatedPropType = __webpack_require__(15);
var _deprecatedPropType2 = _interopRequireDefault(_deprecatedPropType);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context, state) {
var anchorEl = state.anchorEl;
var fullWidth = props.fullWidth;
var styles = {
root: {
display: 'inline-block',
position: 'relative',
width: fullWidth ? '100%' : 256
},
menu: {
width: '100%'
},
list: {
display: 'block',
width: fullWidth ? '100%' : 256
},
innerDiv: {
overflow: 'hidden'
}
};
if (anchorEl && fullWidth) {
styles.popover = {
width: anchorEl.clientWidth
};
}
return styles;
}
var AutoComplete = function (_Component) {
_inherits(AutoComplete, _Component);
function AutoComplete() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, AutoComplete);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(AutoComplete)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
anchorEl: null,
focusTextField: true,
open: false,
searchText: undefined
}, _this.handleRequestClose = function () {
// Only take into account the Popover clickAway when we are
// not focusing the TextField.
if (!_this.state.focusTextField) {
_this.close();
}
}, _this.handleMouseDown = function (event) {
// Keep the TextField focused
event.preventDefault();
}, _this.handleItemTouchTap = function (event, child) {
var dataSource = _this.props.dataSource;
var index = parseInt(child.key, 10);
var chosenRequest = dataSource[index];
var searchText = typeof chosenRequest === 'string' ? chosenRequest : chosenRequest.text;
_this.props.onNewRequest(chosenRequest, index);
_this.timerTouchTapCloseId = setTimeout(function () {
_this.setState({
searchText: searchText
});
_this.close();
_this.timerTouchTapCloseId = null;
}, _this.props.menuCloseDelay);
}, _this.handleEscKeyDown = function () {
_this.close();
}, _this.handleKeyDown = function (event) {
if (_this.props.onKeyDown) _this.props.onKeyDown(event);
switch ((0, _keycode2.default)(event)) {
case 'enter':
_this.close();
var searchText = _this.state.searchText;
if (searchText !== '') {
_this.props.onNewRequest(searchText, -1);
}
break;
case 'esc':
_this.close();
break;
case 'down':
event.preventDefault();
_this.setState({
open: true,
focusTextField: false,
anchorEl: _reactDom2.default.findDOMNode(_this.refs.searchTextField)
});
break;
default:
break;
}
}, _this.handleChange = function (event) {
var searchText = event.target.value;
// Make sure that we have a new searchText.
// Fix an issue with a Cordova Webview
if (searchText === _this.state.searchText) {
return;
}
_this.setState({
searchText: searchText,
open: true,
anchorEl: _reactDom2.default.findDOMNode(_this.refs.searchTextField)
}, function () {
_this.props.onUpdateInput(searchText, _this.props.dataSource);
});
}, _this.handleBlur = function (event) {
if (_this.state.focusTextField && _this.timerTouchTapCloseId === null) {
_this.close();
}
if (_this.props.onBlur) {
_this.props.onBlur(event);
}
}, _this.handleFocus = function (event) {
if (!_this.state.open && (_this.props.triggerUpdateOnFocus || _this.props.openOnFocus)) {
_this.setState({
open: true,
anchorEl: _reactDom2.default.findDOMNode(_this.refs.searchTextField)
});
}
_this.setState({
focusTextField: true
});
if (_this.props.onFocus) {
_this.props.onFocus(event);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(AutoComplete, [{
key: 'componentWillMount',
value: function componentWillMount() {
this.requestsList = [];
this.setState({
open: this.props.open,
searchText: this.props.searchText
});
this.timerTouchTapCloseId = null;
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (this.props.searchText !== nextProps.searchText) {
this.setState({
searchText: nextProps.searchText
});
}
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
clearTimeout(this.timerTouchTapCloseId);
}
}, {
key: 'close',
value: function close() {
this.setState({
open: false,
anchorEl: null
});
}
}, {
key: 'setValue',
value: function setValue(textValue) {
true ? (0, _warning2.default)(false, 'setValue() is deprecated, use the searchText property.') : void 0;
this.setState({
searchText: textValue
});
}
}, {
key: 'getValue',
value: function getValue() {
true ? (0, _warning2.default)(false, 'getValue() is deprecated.') : void 0;
return this.state.searchText;
}
}, {
key: 'blur',
value: function blur() {
this.refs.searchTextField.blur();
}
}, {
key: 'focus',
value: function focus() {
this.refs.searchTextField.focus();
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var anchorOrigin = _props.anchorOrigin;
var animated = _props.animated;
var style = _props.style;
var errorStyle = _props.errorStyle;
var floatingLabelText = _props.floatingLabelText;
var hintText = _props.hintText;
var filter = _props.filter;
var fullWidth = _props.fullWidth;
var menuStyle = _props.menuStyle;
var menuProps = _props.menuProps;
var listStyle = _props.listStyle;
var targetOrigin = _props.targetOrigin;
var disableFocusRipple = _props.disableFocusRipple;
var triggerUpdateOnFocus = _props.triggerUpdateOnFocus;
var // eslint-disable-line no-unused-vars
openOnFocus = _props.openOnFocus;
var // eslint-disable-line no-unused-vars
maxSearchResults = _props.maxSearchResults;
var dataSource = _props.dataSource;
var other = _objectWithoutProperties(_props, ['anchorOrigin', 'animated', 'style', 'errorStyle', 'floatingLabelText', 'hintText', 'filter', 'fullWidth', 'menuStyle', 'menuProps', 'listStyle', 'targetOrigin', 'disableFocusRipple', 'triggerUpdateOnFocus', 'openOnFocus', 'maxSearchResults', 'dataSource']);
var _state = this.state;
var open = _state.open;
var anchorEl = _state.anchorEl;
var searchText = _state.searchText;
var focusTextField = _state.focusTextField;
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context, this.state);
var requestsList = [];
dataSource.every(function (item, index) {
switch (typeof item === 'undefined' ? 'undefined' : _typeof(item)) {
case 'string':
if (filter(searchText, item, item)) {
requestsList.push({
text: item,
value: _react2.default.createElement(_MenuItem2.default, {
innerDivStyle: styles.innerDiv,
value: item,
primaryText: item,
disableFocusRipple: disableFocusRipple,
key: index
})
});
}
break;
case 'object':
if (item && typeof item.text === 'string') {
if (filter(searchText, item.text, item)) {
if (item.value.type && (item.value.type.muiName === _MenuItem2.default.muiName || item.value.type.muiName === _Divider2.default.muiName)) {
requestsList.push({
text: item.text,
value: _react2.default.cloneElement(item.value, {
key: index,
disableFocusRipple: disableFocusRipple
})
});
} else {
requestsList.push({
text: item.text,
value: _react2.default.createElement(_MenuItem2.default, {
innerDivStyle: styles.innerDiv,
primaryText: item.value,
disableFocusRipple: disableFocusRipple,
key: index
})
});
}
}
}
break;
default:
// Do nothing
}
return !(maxSearchResults && maxSearchResults > 0 && requestsList.length === maxSearchResults);
});
this.requestsList = requestsList;
var menu = open && requestsList.length > 0 && _react2.default.createElement(
_Menu2.default,
_extends({}, menuProps, {
ref: 'menu',
autoWidth: false,
disableAutoFocus: focusTextField,
onEscKeyDown: this.handleEscKeyDown,
initiallyKeyboardFocused: true,
onItemTouchTap: this.handleItemTouchTap,
onMouseDown: this.handleMouseDown,
style: (0, _simpleAssign2.default)(styles.menu, menuStyle),
listStyle: (0, _simpleAssign2.default)(styles.list, listStyle)
}),
requestsList.map(function (i) {
return i.value;
})
);
return _react2.default.createElement(
'div',
{ style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) },
_react2.default.createElement(_TextField2.default, _extends({}, other, {
ref: 'searchTextField',
autoComplete: 'off',
value: searchText,
onChange: this.handleChange,
onBlur: this.handleBlur,
onFocus: this.handleFocus,
onKeyDown: this.handleKeyDown,
floatingLabelText: floatingLabelText,
hintText: hintText,
fullWidth: fullWidth,
multiLine: false,
errorStyle: errorStyle
})),
_react2.default.createElement(
_Popover2.default,
{
style: styles.popover,
canAutoPosition: false,
anchorOrigin: anchorOrigin,
targetOrigin: targetOrigin,
open: open,
anchorEl: anchorEl,
useLayerForClickAway: false,
onRequestClose: this.handleRequestClose,
animated: animated
},
menu
)
);
}
}]);
return AutoComplete;
}(_react.Component);
AutoComplete.propTypes = {
/**
* Location of the anchor for the auto complete.
*/
anchorOrigin: _propTypes2.default.origin,
/**
* If true, the auto complete is animated as it is toggled.
*/
animated: _react.PropTypes.bool,
/**
* Array of strings or nodes used to populate the list.
*/
dataSource: _react.PropTypes.array.isRequired,
/**
* Disables focus ripple when true.
*/
disableFocusRipple: _react.PropTypes.bool,
/**
* Override style prop for error.
*/
errorStyle: _react.PropTypes.object,
/**
* The error content to display.
*/
errorText: _react.PropTypes.node,
/**
* Callback function used to filter the auto complete.
*
* @param {string} searchText The text to search for within `dataSource`.
* @param {string} key `dataSource` element, or `text` property on that element if it's not a string.
* @returns {boolean} `true` indicates the auto complete list will include `key` when the input is `searchText`.
*/
filter: _react.PropTypes.func,
/**
* The content to use for adding floating label element.
*/
floatingLabelText: _react.PropTypes.node,
/**
* If true, the field receives the property `width: 100%`.
*/
fullWidth: _react.PropTypes.bool,
/**
* The hint content to display.
*/
hintText: _react.PropTypes.node,
/**
* Override style for list.
*/
listStyle: _react.PropTypes.object,
/**
* The max number of search results to be shown.
* By default it shows all the items which matches filter.
*/
maxSearchResults: _react.PropTypes.number,
/**
* Delay for closing time of the menu.
*/
menuCloseDelay: _react.PropTypes.number,
/**
* Props to be passed to menu.
*/
menuProps: _react.PropTypes.object,
/**
* Override style for menu.
*/
menuStyle: _react.PropTypes.object,
/**
* Callback function that is fired when the `TextField` loses focus.
*
* @param {object} event `blur` event targeting the `TextField`.
*/
onBlur: _react.PropTypes.func,
/**
* Callback function that is fired when the `TextField` gains focus.
*
* @param {object} event `focus` event targeting the `TextField`.
*/
onFocus: _react.PropTypes.func,
/**
* Callback function that is fired when the `TextField` receives a keydown event.
*/
onKeyDown: _react.PropTypes.func,
/**
* Callback function that is fired when a list item is selected, or enter is pressed in the `TextField`.
*
* @param {string} chosenRequest Either the `TextField` input value, if enter is pressed in the `TextField`,
* or the text value of the corresponding list item that was selected.
* @param {number} index The index in `dataSource` of the list item selected, or `-1` if enter is pressed in the
* `TextField`.
*/
onNewRequest: _react.PropTypes.func,
/**
* Callback function that is fired when the user updates the `TextField`.
*
* @param {string} searchText The auto-complete's `searchText` value.
* @param {array} dataSource The auto-complete's `dataSource` array.
*/
onUpdateInput: _react.PropTypes.func,
/**
* Auto complete menu is open if true.
*/
open: _react.PropTypes.bool,
/**
* If true, the list item is showed when a focus event triggers.
*/
openOnFocus: _react.PropTypes.bool,
/**
* Text being input to auto complete.
*/
searchText: _react.PropTypes.string,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* Origin for location of target.
*/
targetOrigin: _propTypes2.default.origin,
/**
* If true, will update when focus event triggers.
*/
triggerUpdateOnFocus: (0, _deprecatedPropType2.default)(_react.PropTypes.bool, 'Instead, use openOnFocus')
};
AutoComplete.defaultProps = {
anchorOrigin: {
vertical: 'bottom',
horizontal: 'left'
},
animated: true,
disableFocusRipple: true,
filter: function filter(searchText, key) {
return searchText !== '' && key.indexOf(searchText) !== -1;
},
fullWidth: false,
open: false,
openOnFocus: false,
onUpdateInput: function onUpdateInput() {},
onNewRequest: function onNewRequest() {},
searchText: '',
menuCloseDelay: 300,
targetOrigin: {
vertical: 'top',
horizontal: 'left'
}
};
AutoComplete.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
AutoComplete.levenshteinDistance = function (searchText, key) {
var current = [];
var prev = void 0;
var value = void 0;
for (var i = 0; i <= key.length; i++) {
for (var j = 0; j <= searchText.length; j++) {
if (i && j) {
if (searchText.charAt(j - 1) === key.charAt(i - 1)) value = prev;else value = Math.min(current[j], current[j - 1], prev) + 1;
} else {
value = i + j;
}
prev = current[j];
current[j] = value;
}
}
return current.pop();
};
AutoComplete.noFilter = function () {
return true;
};
AutoComplete.defaultFilter = AutoComplete.caseSensitiveFilter = function (searchText, key) {
return searchText !== '' && key.indexOf(searchText) !== -1;
};
AutoComplete.caseInsensitiveFilter = function (searchText, key) {
return key.toLowerCase().indexOf(searchText.toLowerCase()) !== -1;
};
AutoComplete.levenshteinDistanceFilter = function (distanceLessThan) {
if (distanceLessThan === undefined) {
return AutoComplete.levenshteinDistance;
} else if (typeof distanceLessThan !== 'number') {
throw 'Error: AutoComplete.levenshteinDistanceFilter is a filter generator, not a filter!';
}
return function (s, k) {
return AutoComplete.levenshteinDistance(s, k) < distanceLessThan;
};
};
AutoComplete.fuzzyFilter = function (searchText, key) {
var compareString = key.toLowerCase();
searchText = searchText.toLowerCase();
var searchTextIndex = 0;
for (var index = 0; index < key.length; index++) {
if (compareString[index] === searchText[searchTextIndex]) {
searchTextIndex += 1;
}
}
return searchTextIndex === searchText.length;
};
AutoComplete.Item = _MenuItem2.default;
AutoComplete.Divider = _Divider2.default;
exports.default = AutoComplete;
/***/ },
/* 101 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _AutoComplete = __webpack_require__(100);
var _AutoComplete2 = _interopRequireDefault(_AutoComplete);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _AutoComplete2.default;
/***/ },
/* 102 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var backgroundColor = props.backgroundColor;
var color = props.color;
var size = props.size;
var src = props.src;
var avatar = context.muiTheme.avatar;
var styles = {
root: {
color: color || avatar.color,
backgroundColor: backgroundColor || avatar.backgroundColor,
userSelect: 'none',
display: 'inline-block',
textAlign: 'center',
lineHeight: size + 'px',
fontSize: size / 2,
borderRadius: '50%',
height: size,
width: size
},
icon: {
color: color || avatar.color,
width: size * 0.6,
height: size * 0.6,
fontSize: size * 0.6,
margin: size * 0.2
}
};
if (src && avatar.borderColor) {
(0, _simpleAssign2.default)(styles.root, {
background: 'url(' + src + ')',
backgroundSize: size,
backgroundOrigin: 'border-box',
border: 'solid 1px ' + avatar.borderColor,
height: size - 2,
width: size - 2
});
}
return styles;
}
var Avatar = function (_Component) {
_inherits(Avatar, _Component);
function Avatar() {
_classCallCheck(this, Avatar);
return _possibleConstructorReturn(this, Object.getPrototypeOf(Avatar).apply(this, arguments));
}
_createClass(Avatar, [{
key: 'render',
value: function render() {
var _props = this.props;
var icon = _props.icon;
var src = _props.src;
var style = _props.style;
var className = _props.className;
var other = _objectWithoutProperties(_props, ['icon', 'src', 'style', 'className']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
if (src) {
return _react2.default.createElement('div', _extends({}, other, {
style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)),
className: className
}));
} else {
return _react2.default.createElement(
'div',
_extends({}, other, {
style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)),
className: className
}),
icon && _react2.default.cloneElement(icon, {
color: styles.icon.color,
style: (0, _simpleAssign2.default)(styles.icon, icon.props.style)
}),
this.props.children
);
}
}
}]);
return Avatar;
}(_react.Component);
Avatar.muiName = 'Avatar';
Avatar.propTypes = {
/**
* The backgroundColor of the avatar. Does not apply to image avatars.
*/
backgroundColor: _react.PropTypes.string,
/**
* Can be used, for instance, to render a letter inside the avatar.
*/
children: _react.PropTypes.node,
/**
* The css class name of the root `div` or `img` element.
*/
className: _react.PropTypes.string,
/**
* The icon or letter's color.
*/
color: _react.PropTypes.string,
/**
* This is the SvgIcon or FontIcon to be used inside the avatar.
*/
icon: _react.PropTypes.element,
/**
* This is the size of the avatar in pixels.
*/
size: _react.PropTypes.number,
/**
* If passed in, this component will render an img element. Otherwise, a div will be rendered.
*/
src: _react.PropTypes.string,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
Avatar.defaultProps = {
size: 40
};
Avatar.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = Avatar;
/***/ },
/* 103 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var primary = props.primary;
var secondary = props.secondary;
var badge = context.muiTheme.badge;
var badgeBackgroundColor = void 0;
var badgeTextColor = void 0;
if (primary) {
badgeBackgroundColor = badge.primaryColor;
badgeTextColor = badge.primaryTextColor;
} else if (secondary) {
badgeBackgroundColor = badge.secondaryColor;
badgeTextColor = badge.secondaryTextColor;
} else {
badgeBackgroundColor = badge.color;
badgeTextColor = badge.textColor;
}
var radius = 12;
var radius2x = Math.floor(2 * radius);
return {
root: {
position: 'relative',
display: 'inline-block',
padding: radius2x + 'px ' + radius2x + 'px ' + radius + 'px ' + radius + 'px'
},
badge: {
display: 'flex',
flexDirection: 'row',
flexWrap: 'wrap',
justifyContent: 'center',
alignContent: 'center',
alignItems: 'center',
position: 'absolute',
top: 0,
right: 0,
fontWeight: badge.fontWeight,
fontSize: radius,
width: radius2x,
height: radius2x,
borderRadius: '50%',
backgroundColor: badgeBackgroundColor,
color: badgeTextColor
}
};
}
var Badge = function (_Component) {
_inherits(Badge, _Component);
function Badge() {
_classCallCheck(this, Badge);
return _possibleConstructorReturn(this, Object.getPrototypeOf(Badge).apply(this, arguments));
}
_createClass(Badge, [{
key: 'render',
value: function render() {
var _props = this.props;
var style = _props.style;
var children = _props.children;
var badgeContent = _props.badgeContent;
var badgeStyle = _props.badgeStyle;
var other = _objectWithoutProperties(_props, ['style', 'children', 'badgeContent', 'badgeStyle']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
return _react2.default.createElement(
'div',
_extends({}, other, { style: prepareStyles((0, _simpleAssign2.default)({}, styles.root, style)) }),
children,
_react2.default.createElement(
'span',
{ style: prepareStyles((0, _simpleAssign2.default)({}, styles.badge, badgeStyle)) },
badgeContent
)
);
}
}]);
return Badge;
}(_react.Component);
Badge.propTypes = {
/**
* This is the content rendered within the badge.
*/
badgeContent: _react.PropTypes.node.isRequired,
/**
* Override the inline-styles of the badge element.
*/
badgeStyle: _react.PropTypes.object,
/**
* The badge will be added relativelty to this node.
*/
children: _react.PropTypes.node,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* If true, the badge will use the primary badge colors.
*/
primary: _react.PropTypes.bool,
/**
* If true, the badge will use the secondary badge colors.
*/
secondary: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
Badge.defaultProps = {
primary: false,
secondary: false
};
Badge.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = Badge;
/***/ },
/* 104 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _Badge = __webpack_require__(103);
var _Badge2 = _interopRequireDefault(_Badge);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _Badge2.default;
/***/ },
/* 105 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _Paper = __webpack_require__(8);
var _Paper2 = _interopRequireDefault(_Paper);
var _CardExpandable = __webpack_require__(55);
var _CardExpandable2 = _interopRequireDefault(_CardExpandable);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var Card = function (_Component) {
_inherits(Card, _Component);
function Card() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, Card);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(Card)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = { expanded: null }, _this.handleExpanding = function (event) {
event.preventDefault();
var newExpandedState = !_this.state.expanded;
// no automatic state update when the component is controlled
if (_this.props.expanded === null) {
_this.setState({ expanded: newExpandedState });
}
if (_this.props.onExpandChange) _this.props.onExpandChange(newExpandedState);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(Card, [{
key: 'componentWillMount',
value: function componentWillMount() {
this.setState({
expanded: this.props.expanded === null ? this.props.initiallyExpanded === true : this.props.expanded
});
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
// update the state when the component is controlled.
if (nextProps.expanded !== null) this.setState({ expanded: nextProps.expanded });
}
}, {
key: 'render',
value: function render() {
var _this2 = this;
var lastElement = void 0;
var expanded = this.state.expanded;
var newChildren = _react2.default.Children.map(this.props.children, function (currentChild) {
var doClone = false;
var newChild = undefined;
var newProps = {};
var element = currentChild;
if (!currentChild || !currentChild.props) {
return null;
}
if (expanded === false && currentChild.props.expandable === true) return;
if (currentChild.props.actAsExpander === true) {
doClone = true;
newProps.onTouchTap = _this2.handleExpanding;
newProps.style = (0, _simpleAssign2.default)({ cursor: 'pointer' }, currentChild.props.style);
}
if (currentChild.props.showExpandableButton === true) {
doClone = true;
newChild = _react2.default.createElement(_CardExpandable2.default, { expanded: expanded, onExpanding: _this2.handleExpanding });
}
if (doClone) {
element = _react2.default.cloneElement(currentChild, newProps, currentChild.props.children, newChild);
}
return element;
}, this);
// If the last element is text or a title we should add
// 8px padding to the bottom of the card
var addBottomPadding = lastElement && (lastElement.type.muiName === 'CardText' || lastElement.type.muiName === 'CardTitle');
var _props = this.props;
var style = _props.style;
var containerStyle = _props.containerStyle;
var other = _objectWithoutProperties(_props, ['style', 'containerStyle']);
var mergedStyles = (0, _simpleAssign2.default)({
zIndex: 1
}, style);
var containerMergedStyles = (0, _simpleAssign2.default)({
paddingBottom: addBottomPadding ? 8 : 0
}, containerStyle);
return _react2.default.createElement(
_Paper2.default,
_extends({}, other, { style: mergedStyles }),
_react2.default.createElement(
'div',
{ style: containerMergedStyles },
newChildren
)
);
}
}]);
return Card;
}(_react.Component);
Card.propTypes = {
/**
* If true, a click on this card component expands the card. Can be set on any child of the `Card` component.
*/
actAsExpander: _react.PropTypes.bool,
/**
* Can be used to render elements inside the Card.
*/
children: _react.PropTypes.node,
/**
* Override the inline-styles of the container element.
*/
containerStyle: _react.PropTypes.object,
/**
* If true, this card component is expandable. Can be set on any child of the `Card` component.
*/
expandable: _react.PropTypes.bool,
/**
* Whether this card is expanded.
* If `true` or `false` the component is controlled.
* if `null` the component is uncontrolled.
*/
expanded: _react.PropTypes.bool,
/**
* Whether this card is initially expanded.
*/
initiallyExpanded: _react.PropTypes.bool,
/**
* Callback function fired when the `expandable` state of the card has changed.
*
* @param {boolean} newExpandedState Represents the new `expanded` state of the card.
*/
onExpandChange: _react.PropTypes.func,
/**
* If true, this card component will include a button to expand the card. `CardTitle`,
* `CardHeader` and `CardActions` implement `showExpandableButton`. Any child component
* of `Card` can implements `showExpandableButton` or forwards the property to a child
* component supporting it.
*/
showExpandableButton: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
Card.defaultProps = {
expanded: null,
expandable: false,
initiallyExpanded: false,
actAsExpander: false
};
exports.default = Card;
/***/ },
/* 106 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.CardExpandable = exports.CardActions = exports.CardText = exports.CardMedia = exports.CardTitle = exports.CardHeader = exports.Card = undefined;
var _Card2 = __webpack_require__(105);
var _Card3 = _interopRequireDefault(_Card2);
var _CardHeader2 = __webpack_require__(56);
var _CardHeader3 = _interopRequireDefault(_CardHeader2);
var _CardTitle2 = __webpack_require__(59);
var _CardTitle3 = _interopRequireDefault(_CardTitle2);
var _CardMedia2 = __webpack_require__(57);
var _CardMedia3 = _interopRequireDefault(_CardMedia2);
var _CardText2 = __webpack_require__(58);
var _CardText3 = _interopRequireDefault(_CardText2);
var _CardActions2 = __webpack_require__(54);
var _CardActions3 = _interopRequireDefault(_CardActions2);
var _CardExpandable2 = __webpack_require__(55);
var _CardExpandable3 = _interopRequireDefault(_CardExpandable2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.Card = _Card3.default;
exports.CardHeader = _CardHeader3.default;
exports.CardTitle = _CardTitle3.default;
exports.CardMedia = _CardMedia3.default;
exports.CardText = _CardText3.default;
exports.CardActions = _CardActions3.default;
exports.CardExpandable = _CardExpandable3.default;
exports.default = _Card3.default;
/***/ },
/* 107 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _EnhancedSwitch = __webpack_require__(42);
var _EnhancedSwitch2 = _interopRequireDefault(_EnhancedSwitch);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _checkBoxOutlineBlank = __webpack_require__(207);
var _checkBoxOutlineBlank2 = _interopRequireDefault(_checkBoxOutlineBlank);
var _checkBox = __webpack_require__(208);
var _checkBox2 = _interopRequireDefault(_checkBox);
var _deprecatedPropType = __webpack_require__(15);
var _deprecatedPropType2 = _interopRequireDefault(_deprecatedPropType);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var checkbox = context.muiTheme.checkbox;
var checkboxSize = 24;
return {
icon: {
height: checkboxSize,
width: checkboxSize
},
check: {
position: 'absolute',
opacity: 0,
transform: 'scale(0)',
transitionOrigin: '50% 50%',
transition: _transitions2.default.easeOut('450ms', 'opacity', '0ms') + ', ' + _transitions2.default.easeOut('0ms', 'transform', '450ms'),
fill: checkbox.checkedColor
},
box: {
position: 'absolute',
opacity: 1,
fill: checkbox.boxColor,
transition: _transitions2.default.easeOut('2s', null, '200ms')
},
checkWhenSwitched: {
opacity: 1,
transform: 'scale(1)',
transition: _transitions2.default.easeOut('0ms', 'opacity', '0ms') + ', ' + _transitions2.default.easeOut('800ms', 'transform', '0ms')
},
boxWhenSwitched: {
transition: _transitions2.default.easeOut('100ms', null, '0ms'),
fill: checkbox.checkedColor
},
checkWhenDisabled: {
fill: checkbox.disabledColor
},
boxWhenDisabled: {
fill: props.checked ? 'transparent' : checkbox.disabledColor
},
label: {
color: props.disabled ? checkbox.labelDisabledColor : checkbox.labelColor
}
};
}
var Checkbox = function (_Component) {
_inherits(Checkbox, _Component);
function Checkbox() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, Checkbox);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(Checkbox)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = { switched: false }, _this.handleCheck = function (event, isInputChecked) {
if (_this.props.onCheck) _this.props.onCheck(event, isInputChecked);
}, _this.handleStateChange = function (newSwitched) {
_this.setState({ switched: newSwitched });
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(Checkbox, [{
key: 'componentWillMount',
value: function componentWillMount() {
var _props = this.props;
var checked = _props.checked;
var defaultChecked = _props.defaultChecked;
var valueLink = _props.valueLink;
if (checked || defaultChecked || valueLink && valueLink.value) {
this.setState({ switched: true });
}
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
this.setState({
switched: this.props.checked !== nextProps.checked ? nextProps.checked : this.state.switched
});
}
}, {
key: 'isChecked',
value: function isChecked() {
return this.refs.enhancedSwitch.isSwitched();
}
}, {
key: 'setChecked',
value: function setChecked(newCheckedValue) {
this.refs.enhancedSwitch.setSwitched(newCheckedValue);
}
}, {
key: 'render',
value: function render() {
var _props2 = this.props;
var iconStyle = _props2.iconStyle;
var onCheck = _props2.onCheck;
var // eslint-disable-line no-unused-vars
checkedIcon = _props2.checkedIcon;
var uncheckedIcon = _props2.uncheckedIcon;
var unCheckedIcon = _props2.unCheckedIcon;
var other = _objectWithoutProperties(_props2, ['iconStyle', 'onCheck', 'checkedIcon', 'uncheckedIcon', 'unCheckedIcon']);
var styles = getStyles(this.props, this.context);
var boxStyles = (0, _simpleAssign2.default)(styles.box, this.state.switched && styles.boxWhenSwitched, iconStyle, this.props.disabled && styles.boxWhenDisabled);
var checkStyles = (0, _simpleAssign2.default)(styles.check, this.state.switched && styles.checkWhenSwitched, iconStyle, this.props.disabled && styles.checkWhenDisabled);
var checkedElement = checkedIcon ? _react2.default.cloneElement(checkedIcon, {
style: (0, _simpleAssign2.default)(checkStyles, checkedIcon.props.style)
}) : _react2.default.createElement(_checkBox2.default, {
style: checkStyles
});
var unCheckedElement = unCheckedIcon || uncheckedIcon ? _react2.default.cloneElement(unCheckedIcon || uncheckedIcon, {
style: (0, _simpleAssign2.default)(boxStyles, (unCheckedIcon || uncheckedIcon).props.style)
}) : _react2.default.createElement(_checkBoxOutlineBlank2.default, {
style: boxStyles
});
var checkboxElement = _react2.default.createElement(
'div',
null,
unCheckedElement,
checkedElement
);
var rippleColor = this.state.switched ? checkStyles.fill : boxStyles.fill;
var mergedIconStyle = (0, _simpleAssign2.default)(styles.icon, iconStyle);
var labelStyle = (0, _simpleAssign2.default)(styles.label, this.props.labelStyle);
var enhancedSwitchProps = {
ref: 'enhancedSwitch',
inputType: 'checkbox',
switched: this.state.switched,
switchElement: checkboxElement,
rippleColor: rippleColor,
iconStyle: mergedIconStyle,
onSwitch: this.handleCheck,
labelStyle: labelStyle,
onParentShouldUpdate: this.handleStateChange,
labelPosition: this.props.labelPosition
};
return _react2.default.createElement(_EnhancedSwitch2.default, _extends({}, other, enhancedSwitchProps));
}
}]);
return Checkbox;
}(_react.Component);
Checkbox.propTypes = {
/**
* Checkbox is checked if true.
*/
checked: _react.PropTypes.bool,
/**
* The SvgIcon to use for the checked state.
* This is useful to create icon toggles.
*/
checkedIcon: _react.PropTypes.element,
/**
* The default state of our checkbox component.
* **Warning:** This cannot be used in conjunction with `checked`.
* Decide between using a controlled or uncontrolled input element and remove one of these props.
* More info: https://fb.me/react-controlled-components
*/
defaultChecked: _react.PropTypes.bool,
/**
* Disabled if true.
*/
disabled: _react.PropTypes.bool,
/**
* Overrides the inline-styles of the icon element.
*/
iconStyle: _react.PropTypes.object,
/**
* Overrides the inline-styles of the input element.
*/
inputStyle: _react.PropTypes.object,
/**
* Where the label will be placed next to the checkbox.
*/
labelPosition: _react.PropTypes.oneOf(['left', 'right']),
/**
* Overrides the inline-styles of the Checkbox element label.
*/
labelStyle: _react.PropTypes.object,
/**
* Callback function that is fired when the checkbox is checked.
*
* @param {object} event `change` event targeting the underlying checkbox `input`.
* @param {boolean} isInputChecked The `checked` value of the underlying checkbox `input`.
*/
onCheck: _react.PropTypes.func,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The SvgIcon to use for the unchecked state.
* This is useful to create icon toggles.
*/
unCheckedIcon: (0, _deprecatedPropType2.default)(_react.PropTypes.element, 'Use uncheckedIcon instead.'),
/**
* The SvgIcon to use for the unchecked state.
* This is useful to create icon toggles.
*/
uncheckedIcon: _react.PropTypes.element,
/**
* ValueLink for when using controlled checkbox.
*/
valueLink: _react.PropTypes.object
};
Checkbox.defaultProps = {
labelPosition: 'right',
disabled: false
};
Checkbox.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = Checkbox;
/***/ },
/* 108 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _autoPrefix = __webpack_require__(14);
var _autoPrefix2 = _interopRequireDefault(_autoPrefix);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getRelativeValue(value, min, max) {
var clampedValue = Math.min(Math.max(min, value), max);
var rangeValue = max - min;
var relValue = Math.round(clampedValue / rangeValue * 10000) / 10000;
return relValue * 100;
}
function getStyles(props, context) {
var max = props.max;
var min = props.min;
var size = props.size;
var value = props.value;
var palette = context.muiTheme.baseTheme.palette;
var zoom = size * 1.4;
var baseSize = 50;
var margin = Math.round((50 * zoom - 50) / 2);
if (margin < 0) margin = 0;
var styles = {
root: {
position: 'relative',
margin: margin,
display: 'inline-block',
width: baseSize,
height: baseSize
},
wrapper: {
width: baseSize,
height: baseSize,
display: 'inline-block',
transition: _transitions2.default.create('transform', '20s', null, 'linear'),
transitionTimingFunction: 'linear'
},
svg: {
height: baseSize,
position: 'relative',
transform: 'scale(' + zoom + ')',
width: baseSize
},
path: {
strokeDasharray: '89, 200',
strokeDashoffset: 0,
stroke: props.color || palette.primary1Color,
strokeLinecap: 'round',
transition: _transitions2.default.create('all', '1.5s', null, 'ease-in-out')
}
};
if (props.mode === 'determinate') {
var relVal = getRelativeValue(value, min, max);
styles.path.transition = _transitions2.default.create('all', '0.3s', null, 'linear');
styles.path.strokeDasharray = Math.round(relVal * 1.25) + ', 200';
}
return styles;
}
var CircularProgress = function (_Component) {
_inherits(CircularProgress, _Component);
function CircularProgress() {
_classCallCheck(this, CircularProgress);
return _possibleConstructorReturn(this, Object.getPrototypeOf(CircularProgress).apply(this, arguments));
}
_createClass(CircularProgress, [{
key: 'componentDidMount',
value: function componentDidMount() {
this.scalePath(this.refs.path);
this.rotateWrapper(this.refs.wrapper);
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
clearTimeout(this.scalePathTimer);
clearTimeout(this.rotateWrapperTimer);
}
}, {
key: 'scalePath',
value: function scalePath(path, step) {
var _this2 = this;
if (this.props.mode !== 'indeterminate') return;
step = step || 0;
step %= 3;
if (step === 0) {
path.style.strokeDasharray = '1, 200';
path.style.strokeDashoffset = 0;
path.style.transitionDuration = '0ms';
} else if (step === 1) {
path.style.strokeDasharray = '89, 200';
path.style.strokeDashoffset = -35;
path.style.transitionDuration = '750ms';
} else {
path.style.strokeDasharray = '89, 200';
path.style.strokeDashoffset = -124;
path.style.transitionDuration = '850ms';
}
this.scalePathTimer = setTimeout(function () {
return _this2.scalePath(path, step + 1);
}, step ? 750 : 250);
}
}, {
key: 'rotateWrapper',
value: function rotateWrapper(wrapper) {
var _this3 = this;
if (this.props.mode !== 'indeterminate') return;
_autoPrefix2.default.set(wrapper.style, 'transform', 'rotate(0deg)');
_autoPrefix2.default.set(wrapper.style, 'transitionDuration', '0ms');
setTimeout(function () {
_autoPrefix2.default.set(wrapper.style, 'transform', 'rotate(1800deg)');
_autoPrefix2.default.set(wrapper.style, 'transitionDuration', '10s');
_autoPrefix2.default.set(wrapper.style, 'transitionTimingFunction', 'linear');
}, 50);
this.rotateWrapperTimer = setTimeout(function () {
return _this3.rotateWrapper(wrapper);
}, 10050);
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var style = _props.style;
var innerStyle = _props.innerStyle;
var size = _props.size;
var other = _objectWithoutProperties(_props, ['style', 'innerStyle', 'size']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
return _react2.default.createElement(
'div',
_extends({}, other, { style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) }),
_react2.default.createElement(
'div',
{ ref: 'wrapper', style: prepareStyles((0, _simpleAssign2.default)(styles.wrapper, innerStyle)) },
_react2.default.createElement(
'svg',
{ style: prepareStyles(styles.svg) },
_react2.default.createElement('circle', {
ref: 'path',
style: prepareStyles(styles.path),
cx: '25',
cy: '25',
r: '20',
fill: 'none',
strokeWidth: '2.5',
strokeMiterlimit: '20'
})
)
)
);
}
}]);
return CircularProgress;
}(_react.Component);
CircularProgress.propTypes = {
/**
* Override the progress's color.
*/
color: _react.PropTypes.string,
/**
* Style for inner wrapper div.
*/
innerStyle: _react.PropTypes.object,
/**
* The max value of progress, only works in determinate mode.
*/
max: _react.PropTypes.number,
/**
* The min value of progress, only works in determinate mode.
*/
min: _react.PropTypes.number,
/**
* The mode of show your progress, indeterminate
* for when there is no value for progress.
*/
mode: _react.PropTypes.oneOf(['determinate', 'indeterminate']),
/**
* The size of the progress.
*/
size: _react.PropTypes.number,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The value of progress, only works in determinate mode.
*/
value: _react.PropTypes.number
};
CircularProgress.defaultProps = {
mode: 'indeterminate',
value: 0,
min: 0,
max: 100,
size: 1
};
CircularProgress.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = CircularProgress;
/***/ },
/* 109 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _CircularProgress = __webpack_require__(108);
var _CircularProgress2 = _interopRequireDefault(_CircularProgress);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _CircularProgress2.default;
/***/ },
/* 110 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactEventListener = __webpack_require__(13);
var _reactEventListener2 = _interopRequireDefault(_reactEventListener);
var _keycode = __webpack_require__(10);
var _keycode2 = _interopRequireDefault(_keycode);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _CalendarActionButtons = __webpack_require__(111);
var _CalendarActionButtons2 = _interopRequireDefault(_CalendarActionButtons);
var _CalendarMonth = __webpack_require__(112);
var _CalendarMonth2 = _interopRequireDefault(_CalendarMonth);
var _CalendarYear = __webpack_require__(114);
var _CalendarYear2 = _interopRequireDefault(_CalendarYear);
var _CalendarToolbar = __webpack_require__(113);
var _CalendarToolbar2 = _interopRequireDefault(_CalendarToolbar);
var _DateDisplay = __webpack_require__(115);
var _DateDisplay2 = _interopRequireDefault(_DateDisplay);
var _SlideIn = __webpack_require__(44);
var _SlideIn2 = _interopRequireDefault(_SlideIn);
var _ClearFix = __webpack_require__(79);
var _ClearFix2 = _interopRequireDefault(_ClearFix);
var _dateUtils = __webpack_require__(17);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
var daysArray = [].concat(_toConsumableArray(Array(7)));
var Calendar = function (_Component) {
_inherits(Calendar, _Component);
function Calendar() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, Calendar);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(Calendar)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
displayDate: undefined,
displayMonthDay: true,
selectedDate: undefined,
transitionDirection: 'left',
transitionEnter: true
}, _this.handleTouchTapDay = function (event, date) {
_this.setSelectedDate(date);
if (_this.props.onTouchTapDay) _this.props.onTouchTapDay(event, date);
}, _this.handleMonthChange = function (months) {
_this.setState({
transitionDirection: months >= 0 ? 'left' : 'right',
displayDate: (0, _dateUtils.addMonths)(_this.state.displayDate, months)
});
}, _this.handleTouchTapYear = function (event, year) {
var date = (0, _dateUtils.cloneDate)(_this.state.selectedDate);
date.setFullYear(year);
_this.setSelectedDate(date, event);
}, _this.handleTouchTapDateDisplayMonthDay = function () {
_this.setState({
displayMonthDay: true
});
}, _this.handleTouchTapDateDisplayYear = function () {
_this.setState({
displayMonthDay: false
});
}, _this.handleWindowKeyDown = function (event) {
if (_this.props.open) {
switch ((0, _keycode2.default)(event)) {
case 'up':
if (event.altKey && event.shiftKey) {
_this.addSelectedYears(-1);
} else if (event.shiftKey) {
_this.addSelectedMonths(-1);
} else {
_this.addSelectedDays(-7);
}
break;
case 'down':
if (event.altKey && event.shiftKey) {
_this.addSelectedYears(1);
} else if (event.shiftKey) {
_this.addSelectedMonths(1);
} else {
_this.addSelectedDays(7);
}
break;
case 'right':
if (event.altKey && event.shiftKey) {
_this.addSelectedYears(1);
} else if (event.shiftKey) {
_this.addSelectedMonths(1);
} else {
_this.addSelectedDays(1);
}
break;
case 'left':
if (event.altKey && event.shiftKey) {
_this.addSelectedYears(-1);
} else if (event.shiftKey) {
_this.addSelectedMonths(-1);
} else {
_this.addSelectedDays(-1);
}
break;
}
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(Calendar, [{
key: 'componentWillMount',
value: function componentWillMount() {
this.setState({
displayDate: (0, _dateUtils.getFirstDayOfMonth)(this.props.initialDate),
selectedDate: this.props.initialDate
});
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (nextProps.initialDate !== this.props.initialDate) {
var date = nextProps.initialDate || new Date();
this.setState({
displayDate: (0, _dateUtils.getFirstDayOfMonth)(date),
selectedDate: date
});
}
}
}, {
key: 'getSelectedDate',
value: function getSelectedDate() {
return this.state.selectedDate;
}
}, {
key: 'isSelectedDateDisabled',
value: function isSelectedDateDisabled() {
if (!this.state.displayMonthDay) {
return false;
}
return this.refs.calendar.isSelectedDateDisabled();
}
}, {
key: 'addSelectedDays',
value: function addSelectedDays(days) {
this.setSelectedDate((0, _dateUtils.addDays)(this.state.selectedDate, days));
}
}, {
key: 'addSelectedMonths',
value: function addSelectedMonths(months) {
this.setSelectedDate((0, _dateUtils.addMonths)(this.state.selectedDate, months));
}
}, {
key: 'addSelectedYears',
value: function addSelectedYears(years) {
this.setSelectedDate((0, _dateUtils.addYears)(this.state.selectedDate, years));
}
}, {
key: 'setDisplayDate',
value: function setDisplayDate(date, newSelectedDate) {
var newDisplayDate = (0, _dateUtils.getFirstDayOfMonth)(date);
var direction = newDisplayDate > this.state.displayDate ? 'left' : 'right';
if (newDisplayDate !== this.state.displayDate) {
this.setState({
displayDate: newDisplayDate,
transitionDirection: direction,
selectedDate: newSelectedDate || this.state.selectedDate
});
}
}
}, {
key: 'setSelectedDate',
value: function setSelectedDate(date) {
var adjustedDate = date;
if ((0, _dateUtils.isBeforeDate)(date, this.props.minDate)) {
adjustedDate = this.props.minDate;
} else if ((0, _dateUtils.isAfterDate)(date, this.props.maxDate)) {
adjustedDate = this.props.maxDate;
}
var newDisplayDate = (0, _dateUtils.getFirstDayOfMonth)(adjustedDate);
if (newDisplayDate !== this.state.displayDate) {
this.setDisplayDate(newDisplayDate, adjustedDate);
} else {
this.setState({
selectedDate: adjustedDate
});
}
}
}, {
key: 'getToolbarInteractions',
value: function getToolbarInteractions() {
return {
prevMonth: (0, _dateUtils.monthDiff)(this.state.displayDate, this.props.minDate) > 0,
nextMonth: (0, _dateUtils.monthDiff)(this.state.displayDate, this.props.maxDate) < 0
};
}
}, {
key: 'yearSelector',
value: function yearSelector() {
if (!this.props.disableYearSelection) return _react2.default.createElement(_CalendarYear2.default, {
key: 'years',
displayDate: this.state.displayDate,
onTouchTapYear: this.handleTouchTapYear,
selectedDate: this.state.selectedDate,
minDate: this.props.minDate,
maxDate: this.props.maxDate
});
}
}, {
key: 'render',
value: function render() {
var prepareStyles = this.context.muiTheme.prepareStyles;
var weekCount = (0, _dateUtils.getWeekArray)(this.state.displayDate, this.props.firstDayOfWeek).length;
var toolbarInteractions = this.getToolbarInteractions();
var isLandscape = this.props.mode === 'landscape';
var calendarTextColor = this.context.muiTheme.datePicker.calendarTextColor;
var styles = {
root: {
color: calendarTextColor,
userSelect: 'none',
width: isLandscape ? 479 : 310
},
calendar: {
display: 'flex',
flexDirection: 'column'
},
calendarContainer: {
display: 'flex',
alignContent: 'space-between',
justifyContent: 'space-between',
flexDirection: 'column',
fontSize: 12,
fontWeight: 400,
padding: '0px 8px',
transition: _transitions2.default.easeOut(),
width: isLandscape ? 294 : 'auto'
},
yearContainer: {
display: 'flex',
justifyContent: 'space-between',
flexDirection: 'column',
height: 272,
marginTop: 10,
overflow: 'hidden',
width: 310
},
dateDisplay: {
width: isLandscape ? 125 : 270,
height: isLandscape ? 290 : 'auto',
float: isLandscape ? 'left' : 'none',
fontWeight: 'bolder'
},
weekTitle: {
display: 'flex',
flexDirection: 'row',
justifyContent: 'space-between',
fontWeight: '500',
height: 20,
lineHeight: '15px',
opacity: '0.5',
textAlign: 'center'
},
weekTitleDay: {
width: 42
},
transitionSlide: {
height: 214
}
};
var weekTitleDayStyle = prepareStyles(styles.weekTitleDay);
var weekTitleStyle = prepareStyles(styles.weekTitle);
var calendarContainerStyle = prepareStyles(styles.calendarContainer);
var yearContainerStyle = prepareStyles(styles.yearContainer);
var _props = this.props;
var cancelLabel = _props.cancelLabel;
var DateTimeFormat = _props.DateTimeFormat;
var firstDayOfWeek = _props.firstDayOfWeek;
var locale = _props.locale;
var okLabel = _props.okLabel;
var onTouchTapCancel = _props.onTouchTapCancel;
var // eslint-disable-line no-unused-vars
onTouchTapOk = _props.onTouchTapOk;
var // eslint-disable-line no-unused-vars
wordings = _props.wordings;
return _react2.default.createElement(
_ClearFix2.default,
{ style: styles.root },
_react2.default.createElement(_reactEventListener2.default, {
target: 'window',
onKeyDown: this.handleWindowKeyDown
}),
_react2.default.createElement(_DateDisplay2.default, {
DateTimeFormat: DateTimeFormat,
disableYearSelection: this.props.disableYearSelection,
onTouchTapMonthDay: this.handleTouchTapDateDisplayMonthDay,
onTouchTapYear: this.handleTouchTapDateDisplayYear,
locale: locale,
monthDaySelected: this.state.displayMonthDay,
mode: this.props.mode,
selectedDate: this.state.selectedDate,
weekCount: weekCount
}),
_react2.default.createElement(
'div',
{ style: styles.calendar },
this.state.displayMonthDay && _react2.default.createElement(
'div',
{ style: calendarContainerStyle },
_react2.default.createElement(_CalendarToolbar2.default, {
DateTimeFormat: DateTimeFormat,
locale: locale,
displayDate: this.state.displayDate,
onMonthChange: this.handleMonthChange,
prevMonth: toolbarInteractions.prevMonth,
nextMonth: toolbarInteractions.nextMonth
}),
_react2.default.createElement(
'div',
{ style: weekTitleStyle },
daysArray.map(function (event, i) {
return _react2.default.createElement(
'span',
{ key: i, style: weekTitleDayStyle },
(0, _dateUtils.localizedWeekday)(DateTimeFormat, locale, i, firstDayOfWeek)
);
})
),
_react2.default.createElement(
_SlideIn2.default,
{ direction: this.state.transitionDirection, style: styles.transitionSlide },
_react2.default.createElement(_CalendarMonth2.default, {
displayDate: this.state.displayDate,
firstDayOfWeek: this.props.firstDayOfWeek,
key: this.state.displayDate.toDateString(),
minDate: this.props.minDate,
maxDate: this.props.maxDate,
onTouchTapDay: this.handleTouchTapDay,
ref: 'calendar',
selectedDate: this.state.selectedDate,
shouldDisableDate: this.props.shouldDisableDate
})
)
),
!this.state.displayMonthDay && _react2.default.createElement(
'div',
{ style: yearContainerStyle },
this.yearSelector()
),
okLabel && _react2.default.createElement(_CalendarActionButtons2.default, {
autoOk: this.props.autoOk,
cancelLabel: cancelLabel,
okLabel: okLabel,
onTouchTapCancel: onTouchTapCancel,
onTouchTapOk: onTouchTapOk,
wordings: wordings
})
)
);
}
}]);
return Calendar;
}(_react.Component);
Calendar.propTypes = {
DateTimeFormat: _react.PropTypes.func.isRequired,
autoOk: _react.PropTypes.bool,
cancelLabel: _react.PropTypes.node,
disableYearSelection: _react.PropTypes.bool,
firstDayOfWeek: _react.PropTypes.number,
initialDate: _react.PropTypes.object,
locale: _react.PropTypes.string.isRequired,
maxDate: _react.PropTypes.object,
minDate: _react.PropTypes.object,
mode: _react.PropTypes.oneOf(['portrait', 'landscape']),
okLabel: _react.PropTypes.node,
onTouchTapCancel: _react.PropTypes.func,
onTouchTapDay: _react.PropTypes.func,
onTouchTapOk: _react.PropTypes.func,
open: _react.PropTypes.bool,
shouldDisableDate: _react.PropTypes.func,
wordings: _react.PropTypes.object
};
Calendar.defaultProps = {
DateTimeFormat: _dateUtils.dateTimeFormat,
disableYearSelection: false,
initialDate: new Date(),
locale: 'en-US',
minDate: (0, _dateUtils.addYears)(new Date(), -100),
maxDate: (0, _dateUtils.addYears)(new Date(), 100)
};
Calendar.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = Calendar;
/***/ },
/* 111 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _FlatButton = __webpack_require__(27);
var _FlatButton2 = _interopRequireDefault(_FlatButton);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var CalendarActionButton = function (_Component) {
_inherits(CalendarActionButton, _Component);
function CalendarActionButton() {
_classCallCheck(this, CalendarActionButton);
return _possibleConstructorReturn(this, Object.getPrototypeOf(CalendarActionButton).apply(this, arguments));
}
_createClass(CalendarActionButton, [{
key: 'render',
value: function render() {
var _props = this.props;
var cancelLabel = _props.cancelLabel;
var okLabel = _props.okLabel;
var wordings = _props.wordings;
var styles = {
root: {
display: 'flex',
flexDirection: 'row',
justifyContent: 'flex-end',
margin: 0,
maxHeight: 48,
padding: 0
},
flatButtons: {
fontsize: 14,
margin: '4px 8px 8px 0px',
maxHeight: 36,
minWidth: 64,
padding: 0
}
};
return _react2.default.createElement(
'div',
{ style: styles.root },
_react2.default.createElement(_FlatButton2.default, {
label: wordings ? wordings.cancel : cancelLabel,
onTouchTap: this.props.onTouchTapCancel,
primary: true,
style: styles.flatButtons
}),
!this.props.autoOk && _react2.default.createElement(_FlatButton2.default, {
disabled: this.refs.calendar !== undefined && this.refs.calendar.isSelectedDateDisabled(),
label: wordings ? wordings.ok : okLabel,
onTouchTap: this.props.onTouchTapOk,
primary: true,
style: styles.flatButtons
})
);
}
}]);
return CalendarActionButton;
}(_react.Component);
CalendarActionButton.propTypes = {
autoOk: _react.PropTypes.bool,
cancelLabel: _react.PropTypes.node,
okLabel: _react.PropTypes.node,
onTouchTapCancel: _react.PropTypes.func,
onTouchTapOk: _react.PropTypes.func,
wordings: _react.PropTypes.object
};
exports.default = CalendarActionButton;
/***/ },
/* 112 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _dateUtils = __webpack_require__(17);
var _DayButton = __webpack_require__(118);
var _DayButton2 = _interopRequireDefault(_DayButton);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var CalendarMonth = function (_Component) {
_inherits(CalendarMonth, _Component);
function CalendarMonth() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, CalendarMonth);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(CalendarMonth)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.handleTouchTapDay = function (event, date) {
if (_this.props.onTouchTapDay) _this.props.onTouchTapDay(event, date);
}, _this.styles = {
root: {
display: 'flex',
flexDirection: 'column',
justifyContent: 'flex-start',
fontWeight: 400,
height: 228,
lineHeight: 2,
position: 'relative',
textAlign: 'center',
MozPaddingStart: 0
},
week: {
display: 'flex',
flexDirection: 'row',
justifyContent: 'space-around',
height: 34,
marginBottom: 2
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(CalendarMonth, [{
key: 'isSelectedDateDisabled',
value: function isSelectedDateDisabled() {
return this.selectedDateDisabled;
}
}, {
key: 'shouldDisableDate',
value: function shouldDisableDate(day) {
if (day === null) return false;
var disabled = !(0, _dateUtils.isBetweenDates)(day, this.props.minDate, this.props.maxDate);
if (!disabled && this.props.shouldDisableDate) disabled = this.props.shouldDisableDate(day);
return disabled;
}
}, {
key: 'getWeekElements',
value: function getWeekElements() {
var _this2 = this;
var weekArray = (0, _dateUtils.getWeekArray)(this.props.displayDate, this.props.firstDayOfWeek);
return weekArray.map(function (week, i) {
return _react2.default.createElement(
'div',
{ key: i, style: _this2.styles.week },
_this2.getDayElements(week, i)
);
}, this);
}
}, {
key: 'getDayElements',
value: function getDayElements(week, i) {
var _this3 = this;
return week.map(function (day, j) {
var isSameDate = (0, _dateUtils.isEqualDate)(_this3.props.selectedDate, day);
var disabled = _this3.shouldDisableDate(day);
var selected = !disabled && isSameDate;
if (isSameDate) {
_this3.selectedDateDisabled = disabled;
}
return _react2.default.createElement(_DayButton2.default, {
date: day,
disabled: disabled,
key: 'db' + (i + j),
onTouchTap: _this3.handleTouchTapDay,
selected: selected
});
}, this);
}
}, {
key: 'render',
value: function render() {
return _react2.default.createElement(
'div',
{ style: this.styles.root },
this.getWeekElements()
);
}
}]);
return CalendarMonth;
}(_react.Component);
CalendarMonth.propTypes = {
autoOk: _react.PropTypes.bool,
displayDate: _react.PropTypes.object.isRequired,
firstDayOfWeek: _react.PropTypes.number,
maxDate: _react.PropTypes.object,
minDate: _react.PropTypes.object,
onTouchTapDay: _react.PropTypes.func,
selectedDate: _react.PropTypes.object.isRequired,
shouldDisableDate: _react.PropTypes.func
};
exports.default = CalendarMonth;
/***/ },
/* 113 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _IconButton = __webpack_require__(20);
var _IconButton2 = _interopRequireDefault(_IconButton);
var _chevronLeft = __webpack_require__(202);
var _chevronLeft2 = _interopRequireDefault(_chevronLeft);
var _chevronRight = __webpack_require__(203);
var _chevronRight2 = _interopRequireDefault(_chevronRight);
var _SlideIn = __webpack_require__(44);
var _SlideIn2 = _interopRequireDefault(_SlideIn);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var styles = {
root: {
display: 'flex',
justifyContent: 'space-between',
backgroundColor: 'inherit',
height: 48
},
titleDiv: {
fontSize: 14,
fontWeight: '500',
textAlign: 'center',
width: '100%'
},
titleText: {
height: 'inherit',
paddingTop: 12
}
};
var CalendarToolbar = function (_Component) {
_inherits(CalendarToolbar, _Component);
function CalendarToolbar() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, CalendarToolbar);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(CalendarToolbar)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
transitionDirection: 'up'
}, _this.handleTouchTapPrevMonth = function () {
if (_this.props.onMonthChange && _this.props.prevMonth) _this.props.onMonthChange(-1);
}, _this.handleTouchTapNextMonth = function () {
if (_this.props.onMonthChange && _this.props.nextMonth) _this.props.onMonthChange(1);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(CalendarToolbar, [{
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (nextProps.displayDate !== this.props.displayDate) {
var direction = nextProps.displayDate > this.props.displayDate ? 'left' : 'right';
this.setState({
transitionDirection: direction
});
}
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var DateTimeFormat = _props.DateTimeFormat;
var locale = _props.locale;
var displayDate = _props.displayDate;
var dateTimeFormatted = new DateTimeFormat(locale, {
month: 'long',
year: 'numeric'
}).format(displayDate);
var nextButtonIcon = this.context.muiTheme.isRtl ? _react2.default.createElement(_chevronLeft2.default, null) : _react2.default.createElement(_chevronRight2.default, null);
var prevButtonIcon = this.context.muiTheme.isRtl ? _react2.default.createElement(_chevronRight2.default, null) : _react2.default.createElement(_chevronLeft2.default, null);
return _react2.default.createElement(
'div',
{ style: styles.root },
_react2.default.createElement(
_IconButton2.default,
{
disabled: !this.props.prevMonth,
onTouchTap: this.handleTouchTapPrevMonth
},
prevButtonIcon
),
_react2.default.createElement(
_SlideIn2.default,
{
direction: this.state.transitionDirection,
style: styles.titleDiv
},
_react2.default.createElement(
'div',
{ key: dateTimeFormatted, style: styles.titleText },
dateTimeFormatted
)
),
_react2.default.createElement(
_IconButton2.default,
{
disabled: !this.props.nextMonth,
onTouchTap: this.handleTouchTapNextMonth
},
nextButtonIcon
)
);
}
}]);
return CalendarToolbar;
}(_react.Component);
CalendarToolbar.propTypes = {
DateTimeFormat: _react.PropTypes.func.isRequired,
displayDate: _react.PropTypes.object.isRequired,
locale: _react.PropTypes.string.isRequired,
nextMonth: _react.PropTypes.bool,
onMonthChange: _react.PropTypes.func,
prevMonth: _react.PropTypes.bool
};
CalendarToolbar.defaultProps = {
nextMonth: true,
prevMonth: true
};
CalendarToolbar.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = CalendarToolbar;
/***/ },
/* 114 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactDom = __webpack_require__(4);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _YearButton = __webpack_require__(119);
var _YearButton2 = _interopRequireDefault(_YearButton);
var _dateUtils = __webpack_require__(17);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var CalendarYear = function (_Component) {
_inherits(CalendarYear, _Component);
function CalendarYear() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, CalendarYear);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(CalendarYear)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.handleTouchTapYear = function (event, year) {
if (_this.props.onTouchTapYear) _this.props.onTouchTapYear(event, year);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(CalendarYear, [{
key: 'componentDidMount',
value: function componentDidMount() {
this.scrollToSelectedYear();
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
this.scrollToSelectedYear();
}
}, {
key: 'getYears',
value: function getYears() {
var minYear = this.props.minDate.getFullYear();
var maxYear = this.props.maxDate.getFullYear();
var years = [];
var dateCheck = (0, _dateUtils.cloneDate)(this.props.selectedDate);
for (var year = minYear; year <= maxYear; year++) {
dateCheck.setFullYear(year);
var selected = this.props.selectedDate.getFullYear() === year;
var selectedProps = {};
if (selected) {
selectedProps = { ref: 'selectedYearButton' };
}
var yearButton = _react2.default.createElement(_YearButton2.default, _extends({
key: 'yb' + year,
onTouchTap: this.handleTouchTapYear,
selected: selected,
year: year
}, selectedProps));
years.push(yearButton);
}
return years;
}
}, {
key: 'scrollToSelectedYear',
value: function scrollToSelectedYear() {
if (this.refs.selectedYearButton === undefined) return;
var container = _reactDom2.default.findDOMNode(this);
var yearButtonNode = _reactDom2.default.findDOMNode(this.refs.selectedYearButton);
var containerHeight = container.clientHeight;
var yearButtonNodeHeight = yearButtonNode.clientHeight || 32;
var scrollYOffset = yearButtonNode.offsetTop + yearButtonNodeHeight / 2 - containerHeight / 2;
container.scrollTop = scrollYOffset;
}
}, {
key: 'render',
value: function render() {
var years = this.getYears();
var backgroundColor = this.context.muiTheme.datePicker.calendarYearBackgroundColor;
var styles = {
backgroundColor: backgroundColor,
height: 'inherit',
lineHeight: '35px',
overflowX: 'hidden',
overflowY: 'scroll',
position: 'relative',
display: 'flex',
flexDirection: 'column',
justifyContent: 'center'
};
return _react2.default.createElement(
'div',
{ style: styles },
_react2.default.createElement(
'div',
null,
years
)
);
}
}]);
return CalendarYear;
}(_react.Component);
CalendarYear.propTypes = {
displayDate: _react.PropTypes.object.isRequired,
maxDate: _react.PropTypes.object,
minDate: _react.PropTypes.object,
onTouchTapYear: _react.PropTypes.func,
selectedDate: _react.PropTypes.object.isRequired,
wordings: _react.PropTypes.object
};
CalendarYear.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = CalendarYear;
/***/ },
/* 115 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _SlideIn = __webpack_require__(44);
var _SlideIn2 = _interopRequireDefault(_SlideIn);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context, state) {
var datePicker = context.muiTheme.datePicker;
var selectedYear = state.selectedYear;
var isLandscape = props.mode === 'landscape';
var styles = {
root: {
width: isLandscape ? 125 : 270,
height: isLandscape ? 290 : 'auto',
float: isLandscape ? 'left' : 'none',
fontWeight: 700,
display: 'inline-block',
backgroundColor: datePicker.selectColor,
borderTopLeftRadius: 2,
borderTopRightRadius: isLandscape ? 0 : 2,
borderBottomLeftRadius: isLandscape ? 2 : 0,
color: datePicker.textColor,
padding: 20
},
monthDay: {
display: 'block',
fontSize: 36,
lineHeight: '36px',
height: props.mode === 'landscape' ? '100%' : 38,
opacity: selectedYear ? 0.7 : 1,
transition: _transitions2.default.easeOut(),
width: '100%',
fontWeight: '500'
},
monthDayTitle: {
cursor: !selectedYear ? 'default' : 'pointer',
width: '100%',
display: 'block'
},
year: {
margin: 0,
fontSize: 16,
fontWeight: '500',
lineHeight: '16px',
height: 16,
opacity: selectedYear ? 1 : 0.7,
transition: _transitions2.default.easeOut(),
marginBottom: 10
},
yearTitle: {
cursor: !selectedYear && !props.disableYearSelection ? 'pointer' : 'default'
}
};
return styles;
}
var DateDisplay = function (_Component) {
_inherits(DateDisplay, _Component);
function DateDisplay() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, DateDisplay);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(DateDisplay)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
selectedYear: !_this.props.monthDaySelected,
transitionDirection: 'up'
}, _this.handleTouchTapMonthDay = function () {
if (_this.props.onTouchTapMonthDay && _this.state.selectedYear) {
_this.props.onTouchTapMonthDay();
}
_this.setState({ selectedYear: false });
}, _this.handleTouchTapYear = function () {
if (_this.props.onTouchTapYear && !_this.props.disableYearSelection && !_this.state.selectedYear) {
_this.props.onTouchTapYear();
}
if (!_this.props.disableYearSelection) {
_this.setState({ selectedYear: true });
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(DateDisplay, [{
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (nextProps.selectedDate !== this.props.selectedDate) {
var direction = nextProps.selectedDate > this.props.selectedDate ? 'up' : 'down';
this.setState({
transitionDirection: direction
});
}
if (nextProps.monthDaySelected !== undefined) {
this.setState({
selectedYear: !nextProps.monthDaySelected
});
}
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var DateTimeFormat = _props.DateTimeFormat;
var locale = _props.locale;
var selectedDate = _props.selectedDate;
var style = _props.style;
var other = _objectWithoutProperties(_props, ['DateTimeFormat', 'locale', 'selectedDate', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context, this.state);
var year = selectedDate.getFullYear();
var dateTimeFormatted = new DateTimeFormat(locale, {
month: 'short',
weekday: 'short',
day: '2-digit'
}).format(selectedDate);
return _react2.default.createElement(
'div',
_extends({}, other, { style: prepareStyles(styles.root, style) }),
_react2.default.createElement(
_SlideIn2.default,
{
style: styles.year,
direction: this.state.transitionDirection
},
_react2.default.createElement(
'div',
{ key: year, style: styles.yearTitle, onTouchTap: this.handleTouchTapYear },
year
)
),
_react2.default.createElement(
_SlideIn2.default,
{
style: styles.monthDay,
direction: this.state.transitionDirection
},
_react2.default.createElement(
'div',
{
key: dateTimeFormatted,
onTouchTap: this.handleTouchTapMonthDay,
style: styles.monthDayTitle
},
dateTimeFormatted
)
)
);
}
}]);
return DateDisplay;
}(_react.Component);
DateDisplay.propTypes = {
DateTimeFormat: _react.PropTypes.func.isRequired,
disableYearSelection: _react.PropTypes.bool,
locale: _react.PropTypes.string.isRequired,
mode: _react.PropTypes.oneOf(['portrait', 'landscape']),
monthDaySelected: _react.PropTypes.bool,
onTouchTapMonthDay: _react.PropTypes.func,
onTouchTapYear: _react.PropTypes.func,
selectedDate: _react.PropTypes.object.isRequired,
style: _react.PropTypes.object,
weekCount: _react.PropTypes.number
};
DateDisplay.defaultProps = {
disableYearSelection: false,
monthDaySelected: true,
weekCount: 4
};
DateDisplay.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = DateDisplay;
/***/ },
/* 116 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _dateUtils = __webpack_require__(17);
var _DatePickerDialog = __webpack_require__(117);
var _DatePickerDialog2 = _interopRequireDefault(_DatePickerDialog);
var _TextField = __webpack_require__(21);
var _TextField2 = _interopRequireDefault(_TextField);
var _deprecatedPropType = __webpack_require__(15);
var _deprecatedPropType2 = _interopRequireDefault(_deprecatedPropType);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var DatePicker = function (_Component) {
_inherits(DatePicker, _Component);
function DatePicker() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, DatePicker);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(DatePicker)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
date: undefined
}, _this.handleAccept = function (date) {
if (!_this.isControlled()) {
_this.setState({
date: date
});
}
if (_this.props.onChange) _this.props.onChange(null, date);
}, _this.handleFocus = function (event) {
event.target.blur();
if (_this.props.onFocus) _this.props.onFocus(event);
}, _this.handleTouchTap = function (event) {
if (_this.props.onTouchTap) _this.props.onTouchTap(event);
if (!_this.props.disabled) setTimeout(function () {
_this.openDialog();
}, 0);
}, _this.formatDate = function (date) {
if (_this.props.locale) {
var DateTimeFormat = _this.props.DateTimeFormat || _dateUtils.dateTimeFormat;
return new DateTimeFormat(_this.props.locale, {
day: 'numeric',
month: 'numeric',
year: 'numeric'
}).format(date);
} else {
return (0, _dateUtils.formatIso)(date);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(DatePicker, [{
key: 'componentWillMount',
value: function componentWillMount() {
this.setState({
date: this.isControlled() ? this.getControlledDate() : this.props.defaultDate
});
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (this.isControlled()) {
var newDate = this.getControlledDate(nextProps);
if (!(0, _dateUtils.isEqualDate)(this.state.date, newDate)) {
this.setState({
date: newDate
});
}
}
}
}, {
key: 'getDate',
value: function getDate() {
return this.state.date;
}
/**
* Open the date-picker dialog programmatically from a parent.
*/
}, {
key: 'openDialog',
value: function openDialog() {
/**
* if the date is not selected then set it to new date
* (get the current system date while doing so)
* else set it to the currently selected date
*/
if (this.state.date !== undefined) {
this.setState({
dialogDate: this.getDate()
}, this.refs.dialogWindow.show);
} else {
this.setState({
dialogDate: new Date()
}, this.refs.dialogWindow.show);
}
}
/**
* Alias for `openDialog()` for an api consistent with TextField.
*/
}, {
key: 'focus',
value: function focus() {
this.openDialog();
}
}, {
key: 'isControlled',
value: function isControlled() {
return this.props.hasOwnProperty('value');
}
}, {
key: 'getControlledDate',
value: function getControlledDate() {
var props = arguments.length <= 0 || arguments[0] === undefined ? this.props : arguments[0];
if (props.value instanceof Date) {
return props.value;
}
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var DateTimeFormat = _props.DateTimeFormat;
var autoOk = _props.autoOk;
var cancelLabel = _props.cancelLabel;
var className = _props.className;
var container = _props.container;
var defaultDate = _props.defaultDate;
var // eslint-disable-line no-unused-vars
disableYearSelection = _props.disableYearSelection;
var firstDayOfWeek = _props.firstDayOfWeek;
var locale = _props.locale;
var maxDate = _props.maxDate;
var minDate = _props.minDate;
var mode = _props.mode;
var okLabel = _props.okLabel;
var onDismiss = _props.onDismiss;
var onFocus = _props.onFocus;
var // eslint-disable-line no-unused-vars
onShow = _props.onShow;
var onTouchTap = _props.onTouchTap;
var // eslint-disable-line no-unused-vars
shouldDisableDate = _props.shouldDisableDate;
var style = _props.style;
var textFieldStyle = _props.textFieldStyle;
var wordings = _props.wordings;
var other = _objectWithoutProperties(_props, ['DateTimeFormat', 'autoOk', 'cancelLabel', 'className', 'container', 'defaultDate', 'disableYearSelection', 'firstDayOfWeek', 'locale', 'maxDate', 'minDate', 'mode', 'okLabel', 'onDismiss', 'onFocus', 'onShow', 'onTouchTap', 'shouldDisableDate', 'style', 'textFieldStyle', 'wordings']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var formatDate = this.props.formatDate || this.formatDate;
return _react2.default.createElement(
'div',
{ className: className, style: prepareStyles((0, _simpleAssign2.default)({}, style)) },
_react2.default.createElement(_TextField2.default, _extends({}, other, {
onFocus: this.handleFocus,
onTouchTap: this.handleTouchTap,
ref: 'input',
style: textFieldStyle,
value: this.state.date ? formatDate(this.state.date) : ''
})),
_react2.default.createElement(_DatePickerDialog2.default, {
DateTimeFormat: DateTimeFormat,
autoOk: autoOk,
cancelLabel: cancelLabel,
container: container,
disableYearSelection: disableYearSelection,
firstDayOfWeek: firstDayOfWeek,
initialDate: this.state.dialogDate,
locale: locale,
maxDate: maxDate,
minDate: minDate,
mode: mode,
okLabel: okLabel,
onAccept: this.handleAccept,
onShow: onShow,
onDismiss: onDismiss,
ref: 'dialogWindow',
shouldDisableDate: shouldDisableDate,
wordings: wordings
})
);
}
}]);
return DatePicker;
}(_react.Component);
DatePicker.propTypes = {
/**
* Constructor for date formatting for the specified `locale`.
* The constructor must follow this specification: ECMAScript Internationalization API 1.0 (ECMA-402).
* `Intl.DateTimeFormat` is supported by most modern browsers, see http://caniuse.com/#search=intl,
* otherwise https://github.com/andyearnshaw/Intl.js is a good polyfill.
*
* By default, a built-in `DateTimeFormat` is used which supports the 'en-US' `locale`.
*/
DateTimeFormat: _react.PropTypes.func,
/**
* If true, automatically accept and close the picker on select a date.
*/
autoOk: _react.PropTypes.bool,
/**
* Override the default text of the 'Cancel' button.
*/
cancelLabel: _react.PropTypes.node,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* Used to control how the Date Picker will be displayed when the input field is focused.
* `dialog` (default) displays the DatePicker as a dialog with a modal.
* `inline` displays the DatePicker below the input field (similar to auto complete).
*/
container: _react.PropTypes.oneOf(['dialog', 'inline']),
/**
* This is the initial date value of the component.
* If either `value` or `valueLink` is provided they will override this
* prop with `value` taking precedence.
*/
defaultDate: _react.PropTypes.object,
/**
* Disables the year selection in the date picker.
*/
disableYearSelection: _react.PropTypes.bool,
/**
* Disables the DatePicker.
*/
disabled: _react.PropTypes.bool,
/**
* Used to change the first day of week. It varies from
* Saturday to Monday between different locales.
* The allowed range is 0 (Sunday) to 6 (Saturday).
* The default is `1`, Monday, as per ISO 8601.
*/
firstDayOfWeek: _react.PropTypes.number,
/**
* This function is called to format the date displayed in the input field, and should return a string.
* By default if no `locale` and `DateTimeFormat` is provided date objects are formatted to ISO 8601 YYYY-MM-DD.
*
* @param {object} date Date object to be formatted.
* @returns {any} The formatted date.
*/
formatDate: _react.PropTypes.func,
/**
* Locale used for formatting the `DatePicker` date strings. Other than for 'en-US', you
* must provide a `DateTimeFormat` that supports the chosen `locale`.
*/
locale: _react.PropTypes.string,
/**
* The ending of a range of valid dates. The range includes the endDate.
* The default value is current date + 100 years.
*/
maxDate: _react.PropTypes.object,
/**
* The beginning of a range of valid dates. The range includes the startDate.
* The default value is current date - 100 years.
*/
minDate: _react.PropTypes.object,
/**
* Tells the component to display the picker in portrait or landscape mode.
*/
mode: _react.PropTypes.oneOf(['portrait', 'landscape']),
/**
* Override the default text of the 'OK' button.
*/
okLabel: _react.PropTypes.node,
/**
* Callback function that is fired when the date value changes.
*
* @param {null} null Since there is no particular event associated with the change,
* the first argument will always be null.
* @param {object} date The new date.
*/
onChange: _react.PropTypes.func,
/**
* Callback function that is fired when the Date Picker's dialog is dismissed.
*/
onDismiss: _react.PropTypes.func,
/**
* Callback function that is fired when the Date Picker's `TextField` gains focus.
*
* @param {object} event `focus` event targeting the `TextField`.
*/
onFocus: _react.PropTypes.func,
/**
* Callback function that is fired when the Date Picker's dialog is shown.
*/
onShow: _react.PropTypes.func,
/**
* Callback function that is fired when a touch tap event occurs on the Date Picker's `TextField`.
*
* @param {object} event TouchTap event targeting the `TextField`.
*/
onTouchTap: _react.PropTypes.func,
/**
* Callback function used to determine if a day's entry should be disabled on the calendar.
*
* @param {object} day Date object of a day.
* @returns {boolean} Indicates whether the day should be disabled.
*/
shouldDisableDate: _react.PropTypes.func,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* Override the inline-styles of DatePicker's TextField element.
*/
textFieldStyle: _react.PropTypes.object,
/**
* Sets the date for the Date Picker programmatically.
*/
value: _react.PropTypes.any,
/**
* Wordings used inside the button of the dialog.
*/
wordings: (0, _deprecatedPropType2.default)(_react.PropTypes.object, 'Instead, use `cancelLabel` and `okLabel`.')
};
DatePicker.defaultProps = {
autoOk: false,
container: 'dialog',
disabled: false,
disableYearSelection: false,
firstDayOfWeek: 1,
style: {}
};
DatePicker.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = DatePicker;
/***/ },
/* 117 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactEventListener = __webpack_require__(13);
var _reactEventListener2 = _interopRequireDefault(_reactEventListener);
var _keycode = __webpack_require__(10);
var _keycode2 = _interopRequireDefault(_keycode);
var _Calendar = __webpack_require__(110);
var _Calendar2 = _interopRequireDefault(_Calendar);
var _Dialog = __webpack_require__(33);
var _Dialog2 = _interopRequireDefault(_Dialog);
var _Popover = __webpack_require__(18);
var _Popover2 = _interopRequireDefault(_Popover);
var _PopoverAnimationVertical = __webpack_require__(39);
var _PopoverAnimationVertical2 = _interopRequireDefault(_PopoverAnimationVertical);
var _dateUtils = __webpack_require__(17);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var DatePickerDialog = function (_Component) {
_inherits(DatePickerDialog, _Component);
function DatePickerDialog() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, DatePickerDialog);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(DatePickerDialog)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
open: false
}, _this.show = function () {
if (_this.props.onShow && !_this.state.open) _this.props.onShow();
_this.setState({
open: true
});
}, _this.dismiss = function () {
if (_this.props.onDismiss && _this.state.open) _this.props.onDismiss();
_this.setState({
open: false
});
}, _this.handleTouchTapDay = function () {
if (_this.props.autoOk) {
setTimeout(_this.handleTouchTapOk, 300);
}
}, _this.handleTouchTapCancel = function () {
_this.dismiss();
}, _this.handleRequestClose = function () {
_this.dismiss();
}, _this.handleTouchTapOk = function () {
if (_this.props.onAccept && !_this.refs.calendar.isSelectedDateDisabled()) {
_this.props.onAccept(_this.refs.calendar.getSelectedDate());
}
_this.dismiss();
}, _this.handleWindowKeyUp = function (event) {
switch ((0, _keycode2.default)(event)) {
case 'enter':
_this.handleTouchTapOk();
break;
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(DatePickerDialog, [{
key: 'render',
value: function render() {
var _props = this.props;
var DateTimeFormat = _props.DateTimeFormat;
var cancelLabel = _props.cancelLabel;
var container = _props.container;
var disableYearSelection = _props.disableYearSelection;
var initialDate = _props.initialDate;
var firstDayOfWeek = _props.firstDayOfWeek;
var locale = _props.locale;
var maxDate = _props.maxDate;
var minDate = _props.minDate;
var mode = _props.mode;
var okLabel = _props.okLabel;
var onAccept = _props.onAccept;
var // eslint-disable-line no-unused-vars
shouldDisableDate = _props.shouldDisableDate;
var style = _props.style;
var // eslint-disable-line no-unused-vars
wordings = _props.wordings;
var other = _objectWithoutProperties(_props, ['DateTimeFormat', 'cancelLabel', 'container', 'disableYearSelection', 'initialDate', 'firstDayOfWeek', 'locale', 'maxDate', 'minDate', 'mode', 'okLabel', 'onAccept', 'shouldDisableDate', 'style', 'wordings']);
var open = this.state.open;
var styles = {
dialogContent: {
width: mode === 'landscape' ? 479 : 310
},
dialogBodyContent: {
padding: 0,
minHeight: mode === 'landscape' ? 330 : 434,
minWidth: mode === 'landscape' ? 479 : 310
}
};
var Container = container === 'inline' ? _Popover2.default : _Dialog2.default;
return _react2.default.createElement(
'div',
_extends({}, other, { ref: 'root' }),
_react2.default.createElement(
Container,
_extends({}, other, {
anchorEl: this.refs.root // For Popover
, animation: _PopoverAnimationVertical2.default // For Popover
, bodyStyle: styles.dialogBodyContent,
contentStyle: styles.dialogContent,
ref: 'dialog',
repositionOnUpdate: true,
open: open,
onRequestClose: this.handleRequestClose,
style: styles.dialogBodyContent
}),
_react2.default.createElement(_reactEventListener2.default, {
target: 'window',
onKeyUp: this.handleWindowKeyUp
}),
_react2.default.createElement(_Calendar2.default, {
autoOk: this.props.autoOk,
DateTimeFormat: DateTimeFormat,
cancelLabel: cancelLabel,
disableYearSelection: disableYearSelection,
firstDayOfWeek: firstDayOfWeek,
initialDate: initialDate,
locale: locale,
onTouchTapDay: this.handleTouchTapDay,
maxDate: maxDate,
minDate: minDate,
mode: mode,
open: open,
ref: 'calendar',
onTouchTapCancel: this.handleTouchTapCancel,
onTouchTapOk: this.handleTouchTapOk,
okLabel: okLabel,
shouldDisableDate: shouldDisableDate,
wordings: wordings
})
)
);
}
}]);
return DatePickerDialog;
}(_react.Component);
DatePickerDialog.propTypes = {
DateTimeFormat: _react.PropTypes.func,
autoOk: _react.PropTypes.bool,
cancelLabel: _react.PropTypes.node,
container: _react.PropTypes.oneOf(['dialog', 'inline']),
disableYearSelection: _react.PropTypes.bool,
firstDayOfWeek: _react.PropTypes.number,
initialDate: _react.PropTypes.object,
locale: _react.PropTypes.string,
maxDate: _react.PropTypes.object,
minDate: _react.PropTypes.object,
mode: _react.PropTypes.oneOf(['portrait', 'landscape']),
okLabel: _react.PropTypes.node,
onAccept: _react.PropTypes.func,
onDismiss: _react.PropTypes.func,
onShow: _react.PropTypes.func,
open: _react.PropTypes.bool,
shouldDisableDate: _react.PropTypes.func,
style: _react.PropTypes.object,
wordings: _react.PropTypes.object
};
DatePickerDialog.defaultProps = {
DateTimeFormat: _dateUtils.dateTimeFormat,
container: 'dialog',
locale: 'en-US',
okLabel: 'OK',
cancelLabel: 'Cancel'
};
DatePickerDialog.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = DatePickerDialog;
/***/ },
/* 118 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _dateUtils = __webpack_require__(17);
var _EnhancedButton = __webpack_require__(11);
var _EnhancedButton2 = _interopRequireDefault(_EnhancedButton);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context, state) {
var date = props.date;
var disabled = props.disabled;
var selected = props.selected;
var hover = state.hover;
var _context$muiTheme = context.muiTheme;
var baseTheme = _context$muiTheme.baseTheme;
var datePicker = _context$muiTheme.datePicker;
var labelColor = baseTheme.palette.textColor;
var buttonStateOpacity = 0;
var buttonStateTransform = 'scale(0)';
if (hover || selected) {
labelColor = datePicker.selectTextColor;
buttonStateOpacity = selected ? 1 : 0.6;
buttonStateTransform = 'scale(1)';
} else if ((0, _dateUtils.isEqualDate)(date, new Date())) {
labelColor = datePicker.color;
}
return {
root: {
boxSizing: 'border-box',
fontWeight: '400',
opacity: disabled && '0.6',
padding: '4px 0px',
position: 'relative',
WebkitTapHighlightColor: 'rgba(0,0,0,0)', // Remove mobile color flashing (deprecated)
width: 42
},
label: {
color: labelColor,
fontWeight: '400',
position: 'relative'
},
buttonState: {
backgroundColor: datePicker.selectColor,
borderRadius: '50%',
height: 34,
left: 4,
opacity: buttonStateOpacity,
position: 'absolute',
top: 0,
transform: buttonStateTransform,
transition: _transitions2.default.easeOut(),
width: 34
}
};
}
var DayButton = function (_Component) {
_inherits(DayButton, _Component);
function DayButton() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, DayButton);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(DayButton)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
hover: false
}, _this.handleMouseEnter = function () {
if (!_this.props.disabled) _this.setState({ hover: true });
}, _this.handleMouseLeave = function () {
if (!_this.props.disabled) _this.setState({ hover: false });
}, _this.handleTouchTap = function (event) {
if (!_this.props.disabled && _this.props.onTouchTap) _this.props.onTouchTap(event, _this.props.date);
}, _this.handleKeyboardFocus = function (event, keyboardFocused) {
if (!_this.props.disabled && _this.props.onKeyboardFocus) {
_this.props.onKeyboardFocus(event, keyboardFocused, _this.props.date);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(DayButton, [{
key: 'render',
value: function render() {
var _props = this.props;
var date = _props.date;
var // eslint-disable-line no-unused-vars
onTouchTap = _props.onTouchTap;
var // eslint-disable-line no-unused-vars
selected = _props.selected;
var other = _objectWithoutProperties(_props, ['date', 'onTouchTap', 'selected']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context, this.state);
return this.props.date ? _react2.default.createElement(
_EnhancedButton2.default,
_extends({}, other, {
disabled: this.props.disabled,
disableFocusRipple: true,
disableTouchRipple: true,
hoverStyle: styles.hover,
onKeyboardFocus: this.handleKeyboardFocus,
onMouseEnter: this.handleMouseEnter,
onMouseLeave: this.handleMouseLeave,
onTouchTap: this.handleTouchTap,
style: styles.root
}),
_react2.default.createElement('div', { style: prepareStyles(styles.buttonState) }),
_react2.default.createElement(
'span',
{ style: prepareStyles(styles.label) },
this.props.date.getDate()
)
) : _react2.default.createElement('span', { style: prepareStyles(styles.root) });
}
}]);
return DayButton;
}(_react.Component);
DayButton.propTypes = {
date: _react.PropTypes.object,
disabled: _react.PropTypes.bool,
onKeyboardFocus: _react.PropTypes.func,
onTouchTap: _react.PropTypes.func,
selected: _react.PropTypes.bool
};
DayButton.defaultProps = {
selected: false,
disabled: false
};
DayButton.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = DayButton;
/***/ },
/* 119 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _EnhancedButton = __webpack_require__(11);
var _EnhancedButton2 = _interopRequireDefault(_EnhancedButton);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context, state) {
var selected = props.selected;
var year = props.year;
var _context$muiTheme = context.muiTheme;
var baseTheme = _context$muiTheme.baseTheme;
var datePicker = _context$muiTheme.datePicker;
var hover = state.hover;
return {
root: {
boxSizing: 'border-box',
color: year === new Date().getFullYear() && datePicker.color,
display: 'block',
fontSize: 14,
margin: '0 auto',
position: 'relative',
textAlign: 'center',
lineHeight: 'inherit',
WebkitTapHighlightColor: 'rgba(0,0,0,0)' },
// Remove mobile color flashing (deprecated)
label: {
alignSelf: 'center',
color: hover || selected ? datePicker.color : baseTheme.palette.textColor,
fontSize: selected ? 26 : 17,
fontWeight: hover ? 450 : selected ? 500 : 400,
position: 'relative',
top: -1
}
};
}
var YearButton = function (_Component) {
_inherits(YearButton, _Component);
function YearButton() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, YearButton);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(YearButton)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
hover: false
}, _this.handleMouseEnter = function () {
_this.setState({ hover: true });
}, _this.handleMouseLeave = function () {
_this.setState({ hover: false });
}, _this.handleTouchTap = function (event) {
if (_this.props.onTouchTap) _this.props.onTouchTap(event, _this.props.year);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(YearButton, [{
key: 'render',
value: function render() {
var _props = this.props;
var className = _props.className;
var // eslint-disable-line no-unused-vars
year = _props.year;
var onTouchTap = _props.onTouchTap;
var // eslint-disable-line no-unused-vars
selected = _props.selected;
var other = _objectWithoutProperties(_props, ['className', 'year', 'onTouchTap', 'selected']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context, this.state);
return _react2.default.createElement(
_EnhancedButton2.default,
_extends({}, other, {
disableFocusRipple: true,
disableTouchRipple: true,
onMouseEnter: this.handleMouseEnter,
onMouseLeave: this.handleMouseLeave,
onTouchTap: this.handleTouchTap,
style: styles.root
}),
_react2.default.createElement(
'span',
{ style: prepareStyles(styles.label) },
year
)
);
}
}]);
return YearButton;
}(_react.Component);
YearButton.propTypes = {
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
onTouchTap: _react.PropTypes.func,
selected: _react.PropTypes.bool,
year: _react.PropTypes.number
};
YearButton.defaultProps = {
selected: false
};
YearButton.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = YearButton;
/***/ },
/* 120 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _DatePicker = __webpack_require__(116);
var _DatePicker2 = _interopRequireDefault(_DatePicker);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _DatePicker2.default;
/***/ },
/* 121 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactDom = __webpack_require__(4);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _reactEventListener = __webpack_require__(13);
var _reactEventListener2 = _interopRequireDefault(_reactEventListener);
var _keycode = __webpack_require__(10);
var _keycode2 = _interopRequireDefault(_keycode);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _Overlay = __webpack_require__(80);
var _Overlay2 = _interopRequireDefault(_Overlay);
var _RenderToLayer = __webpack_require__(81);
var _RenderToLayer2 = _interopRequireDefault(_RenderToLayer);
var _Paper = __webpack_require__(8);
var _Paper2 = _interopRequireDefault(_Paper);
var _reactAddonsTransitionGroup = __webpack_require__(26);
var _reactAddonsTransitionGroup2 = _interopRequireDefault(_reactAddonsTransitionGroup);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var TransitionItem = function (_Component) {
_inherits(TransitionItem, _Component);
function TransitionItem() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, TransitionItem);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(TransitionItem)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
style: {}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(TransitionItem, [{
key: 'componentWillUnmount',
value: function componentWillUnmount() {
clearTimeout(this.enterTimeout);
clearTimeout(this.leaveTimeout);
}
}, {
key: 'componentWillEnter',
value: function componentWillEnter(callback) {
this.componentWillAppear(callback);
}
}, {
key: 'componentWillAppear',
value: function componentWillAppear(callback) {
var spacing = this.context.muiTheme.baseTheme.spacing;
this.setState({
style: {
opacity: 1,
transform: 'translate3d(0, ' + spacing.desktopKeylineIncrement + 'px, 0)'
}
});
this.enterTimeout = setTimeout(callback, 450); // matches transition duration
}
}, {
key: 'componentWillLeave',
value: function componentWillLeave(callback) {
this.setState({
style: {
opacity: 0,
transform: 'translate3d(0, 0, 0)'
}
});
this.leaveTimeout = setTimeout(callback, 450); // matches transition duration
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var style = _props.style;
var children = _props.children;
var other = _objectWithoutProperties(_props, ['style', 'children']);
var prepareStyles = this.context.muiTheme.prepareStyles;
return _react2.default.createElement(
'div',
_extends({}, other, { style: prepareStyles((0, _simpleAssign2.default)({}, this.state.style, style)) }),
children
);
}
}]);
return TransitionItem;
}(_react.Component);
TransitionItem.propTypes = {
children: _react.PropTypes.node,
style: _react.PropTypes.object
};
TransitionItem.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
function getStyles(props, context) {
var autoScrollBodyContent = props.autoScrollBodyContent;
var open = props.open;
var _context$muiTheme = context.muiTheme;
var _context$muiTheme$bas = _context$muiTheme.baseTheme;
var spacing = _context$muiTheme$bas.spacing;
var palette = _context$muiTheme$bas.palette;
var dialog = _context$muiTheme.dialog;
var zIndex = _context$muiTheme.zIndex;
var gutter = spacing.desktopGutter;
var borderScroll = '1px solid ' + palette.borderColor;
return {
root: {
position: 'fixed',
boxSizing: 'border-box',
WebkitTapHighlightColor: 'rgba(0,0,0,0)', // Remove mobile color flashing (deprecated)
zIndex: zIndex.dialog,
top: 0,
left: open ? 0 : -10000,
width: '100%',
height: '100%',
transition: open ? _transitions2.default.easeOut('0ms', 'left', '0ms') : _transitions2.default.easeOut('0ms', 'left', '450ms')
},
content: {
boxSizing: 'border-box',
WebkitTapHighlightColor: 'rgba(0,0,0,0)', // Remove mobile color flashing (deprecated)
transition: _transitions2.default.easeOut(),
position: 'relative',
width: '75%',
maxWidth: spacing.desktopKeylineIncrement * 12,
margin: '0 auto',
zIndex: zIndex.dialog
},
actionsContainer: {
boxSizing: 'border-box',
WebkitTapHighlightColor: 'rgba(0,0,0,0)', // Remove mobile color flashing (deprecated)
padding: 8,
width: '100%',
textAlign: 'right',
marginTop: autoScrollBodyContent ? -1 : 0,
borderTop: autoScrollBodyContent ? borderScroll : 'none'
},
overlay: {
zIndex: zIndex.dialogOverlay
},
title: {
margin: 0,
padding: gutter + 'px ' + gutter + 'px 20px ' + gutter + 'px',
color: palette.textColor,
fontSize: dialog.titleFontSize,
lineHeight: '32px',
fontWeight: 400,
marginBottom: autoScrollBodyContent ? -1 : 0,
borderBottom: autoScrollBodyContent ? borderScroll : 'none'
},
body: {
fontSize: dialog.bodyFontSize,
color: dialog.bodyColor,
padding: (props.title ? 0 : gutter) + 'px ' + gutter + 'px ' + gutter + 'px',
boxSizing: 'border-box',
overflowY: autoScrollBodyContent ? 'auto' : 'hidden'
}
};
}
var DialogInline = function (_Component2) {
_inherits(DialogInline, _Component2);
function DialogInline() {
var _Object$getPrototypeO2;
var _temp2, _this2, _ret2;
_classCallCheck(this, DialogInline);
for (var _len2 = arguments.length, args = Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}
return _ret2 = (_temp2 = (_this2 = _possibleConstructorReturn(this, (_Object$getPrototypeO2 = Object.getPrototypeOf(DialogInline)).call.apply(_Object$getPrototypeO2, [this].concat(args))), _this2), _this2.handleTouchTapOverlay = function () {
_this2.requestClose(false);
}, _this2.handleKeyUp = function (event) {
if ((0, _keycode2.default)(event) === 'esc') {
_this2.requestClose(false);
}
}, _this2.handleResize = function () {
_this2.positionDialog();
}, _temp2), _possibleConstructorReturn(_this2, _ret2);
}
_createClass(DialogInline, [{
key: 'componentDidMount',
value: function componentDidMount() {
this.positionDialog();
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
this.positionDialog();
}
}, {
key: 'positionDialog',
value: function positionDialog() {
var _props2 = this.props;
var actions = _props2.actions;
var autoDetectWindowHeight = _props2.autoDetectWindowHeight;
var autoScrollBodyContent = _props2.autoScrollBodyContent;
var bodyStyle = _props2.bodyStyle;
var open = _props2.open;
var repositionOnUpdate = _props2.repositionOnUpdate;
var title = _props2.title;
if (!open) {
return;
}
var clientHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
var container = _reactDom2.default.findDOMNode(this);
var dialogWindow = _reactDom2.default.findDOMNode(this.refs.dialogWindow);
var dialogContent = _reactDom2.default.findDOMNode(this.refs.dialogContent);
var minPaddingTop = 16;
// Reset the height in case the window was resized.
dialogWindow.style.height = '';
dialogContent.style.height = '';
var dialogWindowHeight = dialogWindow.offsetHeight;
var paddingTop = (clientHeight - dialogWindowHeight) / 2 - 64;
if (paddingTop < minPaddingTop) paddingTop = minPaddingTop;
// Vertically center the dialog window, but make sure it doesn't
// transition to that position.
if (repositionOnUpdate || !container.style.paddingTop) {
container.style.paddingTop = paddingTop + 'px';
}
// Force a height if the dialog is taller than clientHeight
if (autoDetectWindowHeight || autoScrollBodyContent) {
var styles = getStyles(this.props, this.context);
styles.body = (0, _simpleAssign2.default)(styles.body, bodyStyle);
var maxDialogContentHeight = clientHeight - 2 * 64;
if (title) maxDialogContentHeight -= dialogContent.previousSibling.offsetHeight;
if (_react2.default.Children.count(actions)) {
maxDialogContentHeight -= dialogContent.nextSibling.offsetHeight;
}
dialogContent.style.maxHeight = maxDialogContentHeight + 'px';
}
}
}, {
key: 'requestClose',
value: function requestClose(buttonClicked) {
if (!buttonClicked && this.props.modal) {
return;
}
if (this.props.onRequestClose) {
this.props.onRequestClose(!!buttonClicked);
}
}
}, {
key: 'render',
value: function render() {
var _props3 = this.props;
var actions = _props3.actions;
var actionsContainerClassName = _props3.actionsContainerClassName;
var actionsContainerStyle = _props3.actionsContainerStyle;
var bodyClassName = _props3.bodyClassName;
var bodyStyle = _props3.bodyStyle;
var children = _props3.children;
var className = _props3.className;
var contentClassName = _props3.contentClassName;
var contentStyle = _props3.contentStyle;
var overlayClassName = _props3.overlayClassName;
var overlayStyle = _props3.overlayStyle;
var open = _props3.open;
var titleClassName = _props3.titleClassName;
var titleStyle = _props3.titleStyle;
var title = _props3.title;
var style = _props3.style;
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
styles.root = (0, _simpleAssign2.default)(styles.root, style);
styles.content = (0, _simpleAssign2.default)(styles.content, contentStyle);
styles.body = (0, _simpleAssign2.default)(styles.body, bodyStyle);
styles.actionsContainer = (0, _simpleAssign2.default)(styles.actionsContainer, actionsContainerStyle);
styles.overlay = (0, _simpleAssign2.default)(styles.overlay, overlayStyle);
styles.title = (0, _simpleAssign2.default)(styles.title, titleStyle);
var actionsContainer = _react2.default.Children.count(actions) > 0 && _react2.default.createElement(
'div',
{ className: actionsContainerClassName, style: prepareStyles(styles.actionsContainer) },
_react2.default.Children.toArray(actions)
);
var titleElement = title;
if (_react2.default.isValidElement(title)) {
titleElement = _react2.default.cloneElement(title, {
className: title.props.className || titleClassName,
style: prepareStyles((0, _simpleAssign2.default)(styles.title, title.props.style))
});
} else if (typeof title === 'string') {
titleElement = _react2.default.createElement(
'h3',
{ className: titleClassName, style: prepareStyles(styles.title) },
title
);
}
return _react2.default.createElement(
'div',
{ className: className, style: prepareStyles(styles.root) },
open && _react2.default.createElement(_reactEventListener2.default, {
target: 'window',
onKeyUp: this.handleKeyUp,
onResize: this.handleResize
}),
_react2.default.createElement(
_reactAddonsTransitionGroup2.default,
{
component: 'div',
ref: 'dialogWindow',
transitionAppear: true,
transitionAppearTimeout: 450,
transitionEnter: true,
transitionEnterTimeout: 450
},
open && _react2.default.createElement(
TransitionItem,
{
className: contentClassName,
style: styles.content
},
_react2.default.createElement(
_Paper2.default,
{ zDepth: 4 },
titleElement,
_react2.default.createElement(
'div',
{
ref: 'dialogContent',
className: bodyClassName,
style: prepareStyles(styles.body)
},
children
),
actionsContainer
)
)
),
_react2.default.createElement(_Overlay2.default, {
show: open,
className: overlayClassName,
style: styles.overlay,
onTouchTap: this.handleTouchTapOverlay
})
);
}
}]);
return DialogInline;
}(_react.Component);
DialogInline.propTypes = {
actions: _react.PropTypes.node,
actionsContainerClassName: _react.PropTypes.string,
actionsContainerStyle: _react.PropTypes.object,
autoDetectWindowHeight: _react.PropTypes.bool,
autoScrollBodyContent: _react.PropTypes.bool,
bodyClassName: _react.PropTypes.string,
bodyStyle: _react.PropTypes.object,
children: _react.PropTypes.node,
className: _react.PropTypes.string,
contentClassName: _react.PropTypes.string,
contentStyle: _react.PropTypes.object,
modal: _react.PropTypes.bool,
onRequestClose: _react.PropTypes.func,
open: _react.PropTypes.bool.isRequired,
overlayClassName: _react.PropTypes.string,
overlayStyle: _react.PropTypes.object,
repositionOnUpdate: _react.PropTypes.bool,
style: _react.PropTypes.object,
title: _react.PropTypes.node,
titleClassName: _react.PropTypes.string,
titleStyle: _react.PropTypes.object
};
DialogInline.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
var Dialog = function (_Component3) {
_inherits(Dialog, _Component3);
function Dialog() {
var _Object$getPrototypeO3;
var _temp3, _this3, _ret3;
_classCallCheck(this, Dialog);
for (var _len3 = arguments.length, args = Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
args[_key3] = arguments[_key3];
}
return _ret3 = (_temp3 = (_this3 = _possibleConstructorReturn(this, (_Object$getPrototypeO3 = Object.getPrototypeOf(Dialog)).call.apply(_Object$getPrototypeO3, [this].concat(args))), _this3), _this3.renderLayer = function () {
return _react2.default.createElement(DialogInline, _this3.props);
}, _temp3), _possibleConstructorReturn(_this3, _ret3);
}
_createClass(Dialog, [{
key: 'render',
value: function render() {
return _react2.default.createElement(_RenderToLayer2.default, { render: this.renderLayer, open: true, useLayerForClickAway: false });
}
}]);
return Dialog;
}(_react.Component);
Dialog.propTypes = {
/**
* Action buttons to display below the Dialog content (`children`).
* This property accepts either a React element, or an array of React elements.
*/
actions: _react.PropTypes.node,
/**
* The `className` to add to the actions container's root element.
*/
actionsContainerClassName: _react.PropTypes.string,
/**
* Overrides the inline-styles of the actions container's root element.
*/
actionsContainerStyle: _react.PropTypes.object,
/**
* If set to true, the height of the `Dialog` will be auto detected. A max height
* will be enforced so that the content does not extend beyond the viewport.
*/
autoDetectWindowHeight: _react.PropTypes.bool,
/**
* If set to true, the body content of the `Dialog` will be scrollable.
*/
autoScrollBodyContent: _react.PropTypes.bool,
/**
* The `className` to add to the content's root element under the title.
*/
bodyClassName: _react.PropTypes.string,
/**
* Overrides the inline-styles of the content's root element under the title.
*/
bodyStyle: _react.PropTypes.object,
/**
* The contents of the `Dialog`.
*/
children: _react.PropTypes.node,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* The `className` to add to the content container.
*/
contentClassName: _react.PropTypes.string,
/**
* Overrides the inline-styles of the content container.
*/
contentStyle: _react.PropTypes.object,
/**
* Force the user to use one of the actions in the `Dialog`.
* Clicking outside the `Dialog` will not trigger the `onRequestClose`.
*/
modal: _react.PropTypes.bool,
/**
* Fired when the `Dialog` is requested to be closed by a click outside the `Dialog` or on the buttons.
*
* @param {bool} buttonClicked Determines whether a button click triggered this request.
*/
onRequestClose: _react.PropTypes.func,
/**
* Controls whether the Dialog is opened or not.
*/
open: _react.PropTypes.bool.isRequired,
/**
* The `className` to add to the `Overlay` component that is rendered behind the `Dialog`.
*/
overlayClassName: _react.PropTypes.string,
/**
* Overrides the inline-styles of the `Overlay` component that is rendered behind the `Dialog`.
*/
overlayStyle: _react.PropTypes.object,
/**
* Determines whether the `Dialog` should be repositioned when it's contents are updated.
*/
repositionOnUpdate: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The title to display on the `Dialog`. Could be number, string, element or an array containing these types.
*/
title: _react.PropTypes.node,
/**
* The `className` to add to the title's root container element.
*/
titleClassName: _react.PropTypes.string,
/**
* Overrides the inline-styles of the title's root container element.
*/
titleStyle: _react.PropTypes.object
};
Dialog.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
Dialog.defaultProps = {
autoDetectWindowHeight: true,
autoScrollBodyContent: false,
modal: false,
repositionOnUpdate: true
};
exports.default = Dialog;
/***/ },
/* 122 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
var propTypes = {
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* If true, the `Divider` will be indented `72px`.
*/
inset: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
var defaultProps = {
inset: false
};
var contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
var Divider = function Divider(props, context) {
var inset = props.inset;
var style = props.style;
var other = _objectWithoutProperties(props, ['inset', 'style']);
var muiTheme = context.muiTheme;
var prepareStyles = muiTheme.prepareStyles;
var styles = {
root: {
margin: 0,
marginTop: -1,
marginLeft: inset ? 72 : 0,
height: 1,
border: 'none',
backgroundColor: muiTheme.baseTheme.palette.borderColor
}
};
return _react2.default.createElement('hr', _extends({}, other, { style: prepareStyles((0, _simpleAssign2.default)({}, styles.root, style)) }));
};
Divider.muiName = 'Divider';
Divider.propTypes = propTypes;
Divider.defaultProps = defaultProps;
Divider.contextTypes = contextTypes;
exports.default = Divider;
/***/ },
/* 123 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactDom = __webpack_require__(4);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _reactEventListener = __webpack_require__(13);
var _reactEventListener2 = _interopRequireDefault(_reactEventListener);
var _keycode = __webpack_require__(10);
var _keycode2 = _interopRequireDefault(_keycode);
var _autoPrefix = __webpack_require__(14);
var _autoPrefix2 = _interopRequireDefault(_autoPrefix);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _Overlay = __webpack_require__(80);
var _Overlay2 = _interopRequireDefault(_Overlay);
var _Paper = __webpack_require__(8);
var _Paper2 = _interopRequireDefault(_Paper);
var _propTypes = __webpack_require__(9);
var _propTypes2 = _interopRequireDefault(_propTypes);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var openNavEventHandler = null;
var Drawer = function (_Component) {
_inherits(Drawer, _Component);
function Drawer() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, Drawer);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(Drawer)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.handleTouchTapOverlay = function (event) {
event.preventDefault();
_this.close('clickaway');
}, _this.handleKeyUp = function (event) {
if (_this.state.open && !_this.props.docked && (0, _keycode2.default)(event) === 'esc') {
_this.close('escape');
}
}, _this.onBodyTouchStart = function (event) {
var swipeAreaWidth = _this.props.swipeAreaWidth;
var touchStartX = event.touches[0].pageX;
var touchStartY = event.touches[0].pageY;
// Open only if swiping from far left (or right) while closed
if (swipeAreaWidth !== null && !_this.state.open) {
if (_this.props.openSecondary) {
// If openSecondary is true calculate from the far right
if (touchStartX < document.body.offsetWidth - swipeAreaWidth) return;
} else {
// If openSecondary is false calculate from the far left
if (touchStartX > swipeAreaWidth) return;
}
}
if (!_this.state.open && (openNavEventHandler !== _this.onBodyTouchStart || _this.props.disableSwipeToOpen)) {
return;
}
_this.maybeSwiping = true;
_this.touchStartX = touchStartX;
_this.touchStartY = touchStartY;
document.body.addEventListener('touchmove', _this.onBodyTouchMove);
document.body.addEventListener('touchend', _this.onBodyTouchEnd);
document.body.addEventListener('touchcancel', _this.onBodyTouchEnd);
}, _this.onBodyTouchMove = function (event) {
var currentX = event.touches[0].pageX;
var currentY = event.touches[0].pageY;
if (_this.state.swiping) {
event.preventDefault();
_this.setPosition(_this.getTranslateX(currentX));
} else if (_this.maybeSwiping) {
var dXAbs = Math.abs(currentX - _this.touchStartX);
var dYAbs = Math.abs(currentY - _this.touchStartY);
// If the user has moved his thumb ten pixels in either direction,
// we can safely make an assumption about whether he was intending
// to swipe or scroll.
var threshold = 10;
if (dXAbs > threshold && dYAbs <= threshold) {
_this.swipeStartX = currentX;
_this.setState({
swiping: _this.state.open ? 'closing' : 'opening'
});
_this.setPosition(_this.getTranslateX(currentX));
} else if (dXAbs <= threshold && dYAbs > threshold) {
_this.onBodyTouchEnd();
}
}
}, _this.onBodyTouchEnd = function (event) {
if (_this.state.swiping) {
var currentX = event.changedTouches[0].pageX;
var translateRatio = _this.getTranslateX(currentX) / _this.getMaxTranslateX();
_this.maybeSwiping = false;
var swiping = _this.state.swiping;
_this.setState({
swiping: null
});
// We have to open or close after setting swiping to null,
// because only then CSS transition is enabled.
if (translateRatio > 0.5) {
if (swiping === 'opening') {
_this.setPosition(_this.getMaxTranslateX());
} else {
_this.close('swipe');
}
} else {
if (swiping === 'opening') {
_this.open('swipe');
} else {
_this.setPosition(0);
}
}
} else {
_this.maybeSwiping = false;
}
document.body.removeEventListener('touchmove', _this.onBodyTouchMove);
document.body.removeEventListener('touchend', _this.onBodyTouchEnd);
document.body.removeEventListener('touchcancel', _this.onBodyTouchEnd);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(Drawer, [{
key: 'componentWillMount',
value: function componentWillMount() {
this.maybeSwiping = false;
this.touchStartX = null;
this.touchStartY = null;
this.swipeStartX = null;
this.setState({
open: this.props.open !== null ? this.props.open : this.props.docked,
swiping: null
});
}
}, {
key: 'componentDidMount',
value: function componentDidMount() {
this.enableSwipeHandling();
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
// If controlled then the open prop takes precedence.
if (nextProps.open !== null) {
this.setState({
open: nextProps.open
});
// Otherwise, if docked is changed, change the open state for when uncontrolled.
} else if (this.props.docked !== nextProps.docked) {
this.setState({
open: nextProps.docked
});
}
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
this.enableSwipeHandling();
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
this.disableSwipeHandling();
}
}, {
key: 'getStyles',
value: function getStyles() {
var muiTheme = this.context.muiTheme;
var theme = muiTheme.drawer;
var x = this.getTranslateMultiplier() * (this.state.open ? 0 : this.getMaxTranslateX());
var styles = {
root: {
height: '100%',
width: this.props.width || theme.width,
position: 'fixed',
zIndex: muiTheme.zIndex.drawer,
left: 0,
top: 0,
transform: 'translate3d(' + x + 'px, 0, 0)',
transition: !this.state.swiping && _transitions2.default.easeOut(null, 'transform', null),
backgroundColor: theme.color,
overflow: 'auto',
WebkitOverflowScrolling: 'touch' },
// iOS momentum scrolling
overlay: {
zIndex: muiTheme.zIndex.drawerOverlay,
pointerEvents: this.state.open ? 'auto' : 'none' },
// Bypass mouse events when left nav is closing.
rootWhenOpenRight: {
left: 'auto',
right: 0
}
};
return styles;
}
}, {
key: 'shouldShow',
value: function shouldShow() {
return this.state.open || !!this.state.swiping; // component is swiping
}
}, {
key: 'close',
value: function close(reason) {
if (this.props.open === null) this.setState({ open: false });
if (this.props.onRequestChange) this.props.onRequestChange(false, reason);
return this;
}
}, {
key: 'open',
value: function open(reason) {
if (this.props.open === null) this.setState({ open: true });
if (this.props.onRequestChange) this.props.onRequestChange(true, reason);
return this;
}
}, {
key: 'getMaxTranslateX',
value: function getMaxTranslateX() {
var width = this.props.width || this.context.muiTheme.drawer.width;
return width + 10;
}
}, {
key: 'getTranslateMultiplier',
value: function getTranslateMultiplier() {
return this.props.openSecondary ? 1 : -1;
}
}, {
key: 'enableSwipeHandling',
value: function enableSwipeHandling() {
if (!this.props.docked) {
document.body.addEventListener('touchstart', this.onBodyTouchStart);
if (!openNavEventHandler) {
openNavEventHandler = this.onBodyTouchStart;
}
} else {
this.disableSwipeHandling();
}
}
}, {
key: 'disableSwipeHandling',
value: function disableSwipeHandling() {
document.body.removeEventListener('touchstart', this.onBodyTouchStart);
if (openNavEventHandler === this.onBodyTouchStart) {
openNavEventHandler = null;
}
}
}, {
key: 'setPosition',
value: function setPosition(translateX) {
var drawer = _reactDom2.default.findDOMNode(this.refs.clickAwayableElement);
var transformCSS = 'translate3d(' + this.getTranslateMultiplier() * translateX + 'px, 0, 0)';
this.refs.overlay.setOpacity(1 - translateX / this.getMaxTranslateX());
_autoPrefix2.default.set(drawer.style, 'transform', transformCSS);
}
}, {
key: 'getTranslateX',
value: function getTranslateX(currentX) {
return Math.min(Math.max(this.state.swiping === 'closing' ? this.getTranslateMultiplier() * (currentX - this.swipeStartX) : this.getMaxTranslateX() - this.getTranslateMultiplier() * (this.swipeStartX - currentX), 0), this.getMaxTranslateX());
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var children = _props.children;
var className = _props.className;
var containerClassName = _props.containerClassName;
var containerStyle = _props.containerStyle;
var docked = _props.docked;
var openSecondary = _props.openSecondary;
var overlayClassName = _props.overlayClassName;
var overlayStyle = _props.overlayStyle;
var style = _props.style;
var zDepth = _props.zDepth;
var styles = this.getStyles();
var overlay = void 0;
if (!docked) {
overlay = _react2.default.createElement(_Overlay2.default, {
ref: 'overlay',
show: this.shouldShow(),
className: overlayClassName,
style: (0, _simpleAssign2.default)(styles.overlay, overlayStyle),
transitionEnabled: !this.state.swiping,
onTouchTap: this.handleTouchTapOverlay
});
}
return _react2.default.createElement(
'div',
{
className: className,
style: style
},
_react2.default.createElement(_reactEventListener2.default, { target: 'window', onKeyUp: this.handleKeyUp }),
overlay,
_react2.default.createElement(
_Paper2.default,
{
ref: 'clickAwayableElement',
zDepth: zDepth,
rounded: false,
transitionEnabled: !this.state.swiping,
className: containerClassName,
style: (0, _simpleAssign2.default)(styles.root, openSecondary && styles.rootWhenOpenRight, containerStyle)
},
children
)
);
}
}]);
return Drawer;
}(_react.Component);
Drawer.propTypes = {
/**
* The contents of the `Drawer`
*/
children: _react.PropTypes.node,
/**
* The CSS class name of the root element.
*/
className: _react.PropTypes.string,
/**
* The CSS class name of the container element.
*/
containerClassName: _react.PropTypes.string,
/**
* Override the inline-styles of the container element.
*/
containerStyle: _react.PropTypes.object,
/**
* If true, swiping sideways when the `Drawer` is closed will not open it.
*/
disableSwipeToOpen: _react.PropTypes.bool,
/**
* If true, the `Drawer` will be docked. In this state, the overlay won't show and
* clicking on a menu item will not close the `Drawer`.
*/
docked: _react.PropTypes.bool,
/**
* Callback function fired when the `open` state of the `Drawer` is requested to be changed.
*
* @param {boolean} open If true, the `Drawer` was requested to be opened.
* @param {string} reason The reason for the open or close request. Possible values are
* 'swipe' for open requests; 'clickaway' (on overlay clicks),
* 'escape' (on escape key press), and 'swipe' for close requests.
*/
onRequestChange: _react.PropTypes.func,
/**
* If true, the `Drawer` is opened. Providing a value will turn the `Drawer`
* into a controlled component.
*/
open: _react.PropTypes.bool,
/**
* If true, the `Drawer` is positioned to open from the opposite side.
*/
openSecondary: _react.PropTypes.bool,
/**
* The CSS class name to add to the `Overlay` component that is rendered behind the `Drawer`.
*/
overlayClassName: _react.PropTypes.string,
/**
* Override the inline-styles of the `Overlay` component that is rendered behind the `Drawer`.
*/
overlayStyle: _react.PropTypes.object,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The width of the left most (or right most) area in pixels where the `Drawer` can be
* swiped open from. Setting this to `null` spans that area to the entire page
* (**CAUTION!** Setting this property to `null` might cause issues with sliders and
* swipeable `Tabs`: use at your own risk).
*/
swipeAreaWidth: _react.PropTypes.number,
/**
* The width of the `Drawer` in pixels. Defaults to using the values from theme.
*/
width: _react.PropTypes.number,
/**
* The zDepth of the `Drawer`.
*/
zDepth: _propTypes2.default.zDepth
};
Drawer.defaultProps = {
disableSwipeToOpen: false,
docked: true,
open: null,
openSecondary: false,
swipeAreaWidth: 30,
width: null,
zDepth: 2
};
Drawer.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = Drawer;
/***/ },
/* 124 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _Drawer = __webpack_require__(123);
var _Drawer2 = _interopRequireDefault(_Drawer);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _Drawer2.default;
/***/ },
/* 125 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _arrowDropDown = __webpack_require__(200);
var _arrowDropDown2 = _interopRequireDefault(_arrowDropDown);
var _Menu = __webpack_require__(28);
var _Menu2 = _interopRequireDefault(_Menu);
var _ClearFix = __webpack_require__(79);
var _ClearFix2 = _interopRequireDefault(_ClearFix);
var _Popover = __webpack_require__(18);
var _Popover2 = _interopRequireDefault(_Popover);
var _PopoverAnimationVertical = __webpack_require__(39);
var _PopoverAnimationVertical2 = _interopRequireDefault(_PopoverAnimationVertical);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var anchorOrigin = {
vertical: 'top',
horizontal: 'left'
};
function getStyles(props, context) {
var disabled = props.disabled;
var spacing = context.muiTheme.baseTheme.spacing;
var palette = context.muiTheme.baseTheme.palette;
var accentColor = context.muiTheme.dropDownMenu.accentColor;
return {
control: {
cursor: disabled ? 'not-allowed' : 'pointer',
height: '100%',
position: 'relative',
width: '100%'
},
icon: {
fill: accentColor,
position: 'absolute',
right: spacing.desktopGutterLess,
top: (spacing.desktopToolbarHeight - 24) / 2
},
label: {
color: disabled ? palette.disabledColor : palette.textColor,
lineHeight: spacing.desktopToolbarHeight + 'px',
opacity: 1,
position: 'relative',
paddingLeft: spacing.desktopGutter,
paddingRight: spacing.iconSize + spacing.desktopGutterLess + spacing.desktopGutterMini,
top: 0
},
labelWhenOpen: {
opacity: 0,
top: spacing.desktopToolbarHeight / 8
},
root: {
display: 'inline-block',
fontSize: spacing.desktopDropDownMenuFontSize,
height: spacing.desktopSubheaderHeight,
fontFamily: context.muiTheme.baseTheme.fontFamily,
outline: 'none',
position: 'relative',
transition: _transitions2.default.easeOut()
},
rootWhenOpen: {
opacity: 1
},
underline: {
borderTop: 'solid 1px ' + accentColor,
bottom: 1,
left: 0,
margin: '-1px ' + spacing.desktopGutter + 'px',
right: 0,
position: 'absolute'
}
};
}
var DropDownMenu = function (_Component) {
_inherits(DropDownMenu, _Component);
function DropDownMenu() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, DropDownMenu);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(DropDownMenu)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
open: false
}, _this.handleTouchTapControl = function (event) {
event.preventDefault();
if (!_this.props.disabled) {
_this.setState({
open: !_this.state.open,
anchorEl: _this.refs.root
});
}
}, _this.handleRequestCloseMenu = function () {
_this.setState({
open: false,
anchorEl: null
});
}, _this.handleItemTouchTap = function (event, child, index) {
_this.props.onChange(event, index, child.props.value);
_this.setState({
open: false
});
}, _temp), _possibleConstructorReturn(_this, _ret);
}
// The nested styles for drop-down-menu are modified by toolbar and possibly
// other user components, so it will give full access to its js styles rather
// than just the parent.
_createClass(DropDownMenu, [{
key: 'componentDidMount',
value: function componentDidMount() {
var _this2 = this;
if (this.props.autoWidth) {
this.setWidth();
}
if (this.props.openImmediately) {
// TODO: Temporary fix to make openImmediately work with popover.
/* eslint-disable react/no-did-mount-set-state */
setTimeout(function () {
return _this2.setState({ open: true, anchorEl: _this2.refs.root });
});
setTimeout(function () {
return _this2.setState({
open: true,
anchorEl: _this2.refs.root
});
}, 0);
/* eslint-enable react/no-did-mount-set-state */
}
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps() {
if (this.props.autoWidth) {
this.setWidth();
}
}
/**
* This method is deprecated but still here because the TextField
* need it in order to work. TODO: That will be addressed later.
*/
}, {
key: 'getInputNode',
value: function getInputNode() {
var _this3 = this;
var root = this.refs.root;
root.focus = function () {
if (!_this3.props.disabled) {
_this3.setState({
open: !_this3.state.open,
anchorEl: _this3.refs.root
});
}
};
return root;
}
}, {
key: 'setWidth',
value: function setWidth() {
var el = this.refs.root;
if (!this.props.style || !this.props.style.hasOwnProperty('width')) {
el.style.width = 'auto';
}
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var autoWidth = _props.autoWidth;
var children = _props.children;
var className = _props.className;
var iconStyle = _props.iconStyle;
var labelStyle = _props.labelStyle;
var listStyle = _props.listStyle;
var maxHeight = _props.maxHeight;
var menuStyleProps = _props.menuStyle;
var style = _props.style;
var underlineStyle = _props.underlineStyle;
var value = _props.value;
var other = _objectWithoutProperties(_props, ['autoWidth', 'children', 'className', 'iconStyle', 'labelStyle', 'listStyle', 'maxHeight', 'menuStyle', 'style', 'underlineStyle', 'value']);
var _state = this.state;
var anchorEl = _state.anchorEl;
var open = _state.open;
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var displayValue = '';
_react2.default.Children.forEach(children, function (child) {
if (value === child.props.value) {
// This will need to be improved (in case primaryText is a node)
displayValue = child.props.label || child.props.primaryText;
}
});
var menuStyle = void 0;
if (anchorEl && !autoWidth) {
menuStyle = (0, _simpleAssign2.default)({
width: anchorEl.clientWidth
}, menuStyleProps);
} else {
menuStyle = menuStyleProps;
}
return _react2.default.createElement(
'div',
_extends({}, other, {
ref: 'root',
className: className,
style: prepareStyles((0, _simpleAssign2.default)({}, styles.root, open && styles.rootWhenOpen, style))
}),
_react2.default.createElement(
_ClearFix2.default,
{ style: styles.control, onTouchTap: this.handleTouchTapControl },
_react2.default.createElement(
'div',
{
style: prepareStyles((0, _simpleAssign2.default)({}, styles.label, open && styles.labelWhenOpen, labelStyle))
},
displayValue
),
_react2.default.createElement(_arrowDropDown2.default, { style: (0, _simpleAssign2.default)({}, styles.icon, iconStyle) }),
_react2.default.createElement('div', { style: prepareStyles((0, _simpleAssign2.default)({}, styles.underline, underlineStyle)) })
),
_react2.default.createElement(
_Popover2.default,
{
anchorOrigin: anchorOrigin,
anchorEl: anchorEl,
animation: _PopoverAnimationVertical2.default,
open: open,
onRequestClose: this.handleRequestCloseMenu
},
_react2.default.createElement(
_Menu2.default,
{
maxHeight: maxHeight,
desktop: true,
value: value,
style: menuStyle,
listStyle: listStyle,
onItemTouchTap: this.handleItemTouchTap
},
children
)
)
);
}
}]);
return DropDownMenu;
}(_react.Component);
DropDownMenu.muiName = 'DropDownMenu';
DropDownMenu.propTypes = {
/**
* The width will automatically be set according to the items inside the menu.
* To control this width in css instead, set this prop to `false`.
*/
autoWidth: _react.PropTypes.bool,
/**
* The `MenuItem`s to populate the `Menu` with. If the `MenuItems` have the
* prop `label` that value will be used to render the representation of that
* item within the field.
*/
children: _react.PropTypes.node,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* Disables the menu.
*/
disabled: _react.PropTypes.bool,
/**
* Overrides the styles of icon element.
*/
iconStyle: _react.PropTypes.object,
/**
* Overrides the styles of label when the `DropDownMenu` is inactive.
*/
labelStyle: _react.PropTypes.object,
/**
* The style object to use to override underlying list style.
*/
listStyle: _react.PropTypes.object,
/**
* The maximum height of the `Menu` when it is displayed.
*/
maxHeight: _react.PropTypes.number,
/**
* Overrides the styles of `Menu` when the `DropDownMenu` is displayed.
*/
menuStyle: _react.PropTypes.object,
/**
* Callback function fired when a menu item is clicked, other than the one currently selected.
*
* @param {object} event TouchTap event targeting the menu item that was clicked.
* @param {number} key The index of the clicked menu item in the `children` collection.
* @param {any} payload The `value` prop of the clicked menu item.
*/
onChange: _react.PropTypes.func,
/**
* Set to true to have the `DropDownMenu` automatically open on mount.
*/
openImmediately: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* Overrides the inline-styles of the underline.
*/
underlineStyle: _react.PropTypes.object,
/**
* The value that is currently selected.
*/
value: _react.PropTypes.any
};
DropDownMenu.defaultProps = {
autoWidth: true,
disabled: false,
openImmediately: false,
maxHeight: 500
};
DropDownMenu.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = DropDownMenu;
/***/ },
/* 126 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _childUtils = __webpack_require__(24);
var _colorManipulator = __webpack_require__(12);
var _EnhancedButton = __webpack_require__(11);
var _EnhancedButton2 = _interopRequireDefault(_EnhancedButton);
var _FlatButtonLabel = __webpack_require__(127);
var _FlatButtonLabel2 = _interopRequireDefault(_FlatButtonLabel);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function validateLabel(props, propName, componentName) {
if (!props.children && !props.label && !props.icon) {
return new Error('Required prop label or children or icon was not specified in ' + componentName + '.');
}
}
var FlatButton = function (_Component) {
_inherits(FlatButton, _Component);
function FlatButton() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, FlatButton);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(FlatButton)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
hovered: false,
isKeyboardFocused: false,
touch: false
}, _this.handleKeyboardFocus = function (event, isKeyboardFocused) {
_this.setState({ isKeyboardFocused: isKeyboardFocused });
_this.props.onKeyboardFocus(event, isKeyboardFocused);
}, _this.handleMouseEnter = function (event) {
// Cancel hover styles for touch devices
if (!_this.state.touch) _this.setState({ hovered: true });
_this.props.onMouseEnter(event);
}, _this.handleMouseLeave = function (event) {
_this.setState({ hovered: false });
_this.props.onMouseLeave(event);
}, _this.handleTouchStart = function (event) {
_this.setState({ touch: true });
_this.props.onTouchStart(event);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(FlatButton, [{
key: 'render',
value: function render() {
var _props = this.props;
var children = _props.children;
var disabled = _props.disabled;
var hoverColor = _props.hoverColor;
var backgroundColor = _props.backgroundColor;
var icon = _props.icon;
var label = _props.label;
var labelStyle = _props.labelStyle;
var labelPosition = _props.labelPosition;
var primary = _props.primary;
var rippleColor = _props.rippleColor;
var secondary = _props.secondary;
var style = _props.style;
var other = _objectWithoutProperties(_props, ['children', 'disabled', 'hoverColor', 'backgroundColor', 'icon', 'label', 'labelStyle', 'labelPosition', 'primary', 'rippleColor', 'secondary', 'style']);
var _context$muiTheme = this.context.muiTheme;
var _context$muiTheme$but = _context$muiTheme.button;
var buttonHeight = _context$muiTheme$but.height;
var buttonMinWidth = _context$muiTheme$but.minWidth;
var buttonTextTransform = _context$muiTheme$but.textTransform;
var _context$muiTheme$fla = _context$muiTheme.flatButton;
var buttonFilterColor = _context$muiTheme$fla.buttonFilterColor;
var buttonColor = _context$muiTheme$fla.color;
var disabledTextColor = _context$muiTheme$fla.disabledTextColor;
var fontSize = _context$muiTheme$fla.fontSize;
var fontWeight = _context$muiTheme$fla.fontWeight;
var primaryTextColor = _context$muiTheme$fla.primaryTextColor;
var secondaryTextColor = _context$muiTheme$fla.secondaryTextColor;
var textColor = _context$muiTheme$fla.textColor;
var _context$muiTheme$fla2 = _context$muiTheme$fla.textTransform;
var textTransform = _context$muiTheme$fla2 === undefined ? buttonTextTransform || 'uppercase' : _context$muiTheme$fla2;
var defaultTextColor = disabled ? disabledTextColor : primary ? primaryTextColor : secondary ? secondaryTextColor : textColor;
var defaultHoverColor = (0, _colorManipulator.fade)(buttonFilterColor, 0.2);
var defaultRippleColor = buttonFilterColor;
var buttonHoverColor = hoverColor || defaultHoverColor;
var buttonRippleColor = rippleColor || defaultRippleColor;
var buttonBackgroundColor = backgroundColor || buttonColor;
var hovered = (this.state.hovered || this.state.isKeyboardFocused) && !disabled;
var mergedRootStyles = (0, _simpleAssign2.default)({}, {
height: buttonHeight,
lineHeight: buttonHeight + 'px',
minWidth: buttonMinWidth,
color: defaultTextColor,
transition: _transitions2.default.easeOut(),
borderRadius: 2,
userSelect: 'none',
position: 'relative',
overflow: 'hidden',
backgroundColor: hovered ? buttonHoverColor : buttonBackgroundColor,
padding: 0,
margin: 0,
textAlign: 'center'
}, style);
var iconCloned = void 0;
var labelStyleIcon = {};
if (icon) {
iconCloned = _react2.default.cloneElement(icon, {
color: icon.props.color || mergedRootStyles.color,
style: {
verticalAlign: 'middle',
marginLeft: label && labelPosition !== 'before' ? 12 : 0,
marginRight: label && labelPosition === 'before' ? 12 : 0
}
});
if (labelPosition === 'before') {
labelStyleIcon.paddingRight = 8;
} else {
labelStyleIcon.paddingLeft = 8;
}
}
var mergedLabelStyles = (0, _simpleAssign2.default)({
letterSpacing: 0,
textTransform: textTransform,
fontWeight: fontWeight,
fontSize: fontSize
}, labelStyleIcon, labelStyle);
var labelElement = label ? _react2.default.createElement(_FlatButtonLabel2.default, { label: label, style: mergedLabelStyles }) : undefined;
// Place label before or after children.
var childrenFragment = labelPosition === 'before' ? {
labelElement: labelElement,
iconCloned: iconCloned,
children: children
} : {
children: children,
iconCloned: iconCloned,
labelElement: labelElement
};
var enhancedButtonChildren = (0, _childUtils.createChildFragment)(childrenFragment);
return _react2.default.createElement(
_EnhancedButton2.default,
_extends({}, other, {
disabled: disabled,
focusRippleColor: buttonRippleColor,
focusRippleOpacity: 0.3,
onKeyboardFocus: this.handleKeyboardFocus,
onMouseLeave: this.handleMouseLeave,
onMouseEnter: this.handleMouseEnter,
onTouchStart: this.handleTouchStart,
style: mergedRootStyles,
touchRippleColor: buttonRippleColor,
touchRippleOpacity: 0.3
}),
enhancedButtonChildren
);
}
}]);
return FlatButton;
}(_react.Component);
FlatButton.muiName = 'FlatButton';
FlatButton.propTypes = {
/**
* Color of button when mouse is not hovering over it.
*/
backgroundColor: _react.PropTypes.string,
/**
* This is what will be displayed inside the button.
* If a label is specified, the text within the label prop will
* be displayed. Otherwise, the component will expect children
* which will then be displayed. (In our example,
* we are nesting an `<input type="file" />` and a `span`
* that acts as our label to be displayed.) This only
* applies to flat and raised buttons.
*/
children: _react.PropTypes.node,
/**
* Disables the button if set to true.
*/
disabled: _react.PropTypes.bool,
/**
* Color of button when mouse hovers over.
*/
hoverColor: _react.PropTypes.string,
/**
* The URL to link to when the button is clicked.
*/
href: _react.PropTypes.string,
/**
* Use this property to display an icon.
*/
icon: _react.PropTypes.node,
/**
* Label for the button.
*/
label: validateLabel,
/**
* Place label before or after the passed children.
*/
labelPosition: _react.PropTypes.oneOf(['before', 'after']),
/**
* Override the inline-styles of the button's label element.
*/
labelStyle: _react.PropTypes.object,
/**
* Callback function fired when the element is focused or blurred by the keyboard.
*
* @param {object} event `focus` or `blur` event targeting the element.
* @param {boolean} isKeyboardFocused Indicates whether the element is focused.
*/
onKeyboardFocus: _react.PropTypes.func,
/**
* Callback function fired when the mouse enters the element.
*
* @param {object} event `mouseenter` event targeting the element.
*/
onMouseEnter: _react.PropTypes.func,
/**
* Callback function fired when the mouse leaves the element.
*
* @param {object} event `mouseleave` event targeting the element.
*/
onMouseLeave: _react.PropTypes.func,
/**
* Callback function fired when the element is touched.
*
* @param {object} event `touchstart` event targeting the element.
*/
onTouchStart: _react.PropTypes.func,
/**
* If true, colors button according to
* primaryTextColor from the Theme.
*/
primary: _react.PropTypes.bool,
/**
* Color for the ripple after button is clicked.
*/
rippleColor: _react.PropTypes.string,
/**
* If true, colors button according to secondaryTextColor from the theme.
* The primary prop has precendent if set to true.
*/
secondary: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
FlatButton.defaultProps = {
disabled: false,
labelStyle: {},
labelPosition: 'after',
onKeyboardFocus: function onKeyboardFocus() {},
onMouseEnter: function onMouseEnter() {},
onMouseLeave: function onMouseLeave() {},
onTouchStart: function onTouchStart() {},
primary: false,
secondary: false
};
FlatButton.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = FlatButton;
/***/ },
/* 127 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var baseTheme = context.muiTheme.baseTheme;
return {
root: {
position: 'relative',
paddingLeft: baseTheme.spacing.desktopGutterLess,
paddingRight: baseTheme.spacing.desktopGutterLess,
verticalAlign: 'middle'
}
};
}
var FlatButtonLabel = function (_Component) {
_inherits(FlatButtonLabel, _Component);
function FlatButtonLabel() {
_classCallCheck(this, FlatButtonLabel);
return _possibleConstructorReturn(this, Object.getPrototypeOf(FlatButtonLabel).apply(this, arguments));
}
_createClass(FlatButtonLabel, [{
key: 'render',
value: function render() {
var _props = this.props;
var label = _props.label;
var style = _props.style;
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
return _react2.default.createElement(
'span',
{ style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) },
label
);
}
}]);
return FlatButtonLabel;
}(_react.Component);
FlatButtonLabel.propTypes = {
label: _react.PropTypes.node,
style: _react.PropTypes.object
};
FlatButtonLabel.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = FlatButtonLabel;
/***/ },
/* 128 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _colorManipulator = __webpack_require__(12);
var _EnhancedButton = __webpack_require__(11);
var _EnhancedButton2 = _interopRequireDefault(_EnhancedButton);
var _FontIcon = __webpack_require__(34);
var _FontIcon2 = _interopRequireDefault(_FontIcon);
var _Paper = __webpack_require__(8);
var _Paper2 = _interopRequireDefault(_Paper);
var _childUtils = __webpack_require__(24);
var _warning = __webpack_require__(6);
var _warning2 = _interopRequireDefault(_warning);
var _propTypes = __webpack_require__(9);
var _propTypes2 = _interopRequireDefault(_propTypes);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var floatingActionButton = context.muiTheme.floatingActionButton;
var backgroundColor = props.backgroundColor || floatingActionButton.color;
var iconColor = floatingActionButton.iconColor;
if (props.disabled) {
backgroundColor = props.disabledColor || floatingActionButton.disabledColor;
iconColor = floatingActionButton.disabledTextColor;
} else if (props.secondary) {
backgroundColor = floatingActionButton.secondaryColor;
iconColor = floatingActionButton.secondaryIconColor;
}
return {
root: {
transition: _transitions2.default.easeOut(),
display: 'inline-block'
},
container: {
backgroundColor: backgroundColor,
transition: _transitions2.default.easeOut(),
position: 'relative',
height: floatingActionButton.buttonSize,
width: floatingActionButton.buttonSize,
padding: 0,
overflow: 'hidden',
borderRadius: '50%',
textAlign: 'center',
verticalAlign: 'bottom'
},
containerWhenMini: {
height: floatingActionButton.miniSize,
width: floatingActionButton.miniSize
},
overlay: {
transition: _transitions2.default.easeOut(),
top: 0
},
overlayWhenHovered: {
backgroundColor: (0, _colorManipulator.fade)(iconColor, 0.4)
},
icon: {
height: floatingActionButton.buttonSize,
lineHeight: floatingActionButton.buttonSize + 'px',
fill: iconColor,
color: iconColor
},
iconWhenMini: {
height: floatingActionButton.miniSize,
lineHeight: floatingActionButton.miniSize + 'px'
}
};
}
var FloatingActionButton = function (_Component) {
_inherits(FloatingActionButton, _Component);
function FloatingActionButton() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, FloatingActionButton);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(FloatingActionButton)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
hovered: false,
touch: false,
zDepth: undefined
}, _this.handleMouseDown = function (event) {
// only listen to left clicks
if (event.button === 0) {
_this.setState({ zDepth: _this.props.zDepth + 1 });
}
if (_this.props.onMouseDown) _this.props.onMouseDown(event);
}, _this.handleMouseUp = function (event) {
_this.setState({ zDepth: _this.props.zDepth });
if (_this.props.onMouseUp) _this.props.onMouseUp(event);
}, _this.handleMouseLeave = function (event) {
if (!_this.refs.container.isKeyboardFocused()) _this.setState({ zDepth: _this.props.zDepth, hovered: false });
if (_this.props.onMouseLeave) _this.props.onMouseLeave(event);
}, _this.handleMouseEnter = function (event) {
if (!_this.refs.container.isKeyboardFocused() && !_this.state.touch) {
_this.setState({ hovered: true });
}
if (_this.props.onMouseEnter) _this.props.onMouseEnter(event);
}, _this.handleTouchStart = function (event) {
_this.setState({
touch: true,
zDepth: _this.props.zDepth + 1
});
if (_this.props.onTouchStart) _this.props.onTouchStart(event);
}, _this.handleTouchEnd = function (event) {
_this.setState({ zDepth: _this.props.zDepth });
if (_this.props.onTouchEnd) _this.props.onTouchEnd(event);
}, _this.handleKeyboardFocus = function (event, keyboardFocused) {
if (keyboardFocused && !_this.props.disabled) {
_this.setState({ zDepth: _this.props.zDepth + 1 });
_this.refs.overlay.style.backgroundColor = (0, _colorManipulator.fade)(getStyles(_this.props, _this.context).icon.color, 0.4);
} else if (!_this.state.hovered) {
_this.setState({ zDepth: _this.props.zDepth });
_this.refs.overlay.style.backgroundColor = 'transparent';
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(FloatingActionButton, [{
key: 'componentWillMount',
value: function componentWillMount() {
this.setState({
zDepth: this.props.disabled ? 0 : this.props.zDepth
});
}
}, {
key: 'componentDidMount',
value: function componentDidMount() {
true ? (0, _warning2.default)(!this.props.iconClassName || !this.props.children, 'You have set both an iconClassName and a child icon. ' + 'It is recommended you use only one method when adding ' + 'icons to FloatingActionButtons.') : void 0;
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (nextProps.disabled !== this.props.disabled) {
this.setState({
zDepth: nextProps.disabled ? 0 : this.props.zDepth
});
}
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var className = _props.className;
var disabled = _props.disabled;
var mini = _props.mini;
var secondary = _props.secondary;
var // eslint-disable-line no-unused-vars
iconStyle = _props.iconStyle;
var iconClassName = _props.iconClassName;
var other = _objectWithoutProperties(_props, ['className', 'disabled', 'mini', 'secondary', 'iconStyle', 'iconClassName']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var iconElement = void 0;
if (iconClassName) {
iconElement = _react2.default.createElement(_FontIcon2.default, {
className: iconClassName,
style: (0, _simpleAssign2.default)({}, styles.icon, mini && styles.iconWhenMini, iconStyle)
});
}
var children = (0, _childUtils.extendChildren)(this.props.children, {
style: (0, _simpleAssign2.default)({}, styles.icon, mini && styles.iconWhenMini, iconStyle)
});
var buttonEventHandlers = disabled ? null : {
onMouseDown: this.handleMouseDown,
onMouseUp: this.handleMouseUp,
onMouseLeave: this.handleMouseLeave,
onMouseEnter: this.handleMouseEnter,
onTouchStart: this.handleTouchStart,
onTouchEnd: this.handleTouchEnd,
onKeyboardFocus: this.handleKeyboardFocus
};
return _react2.default.createElement(
_Paper2.default,
{
className: className,
style: (0, _simpleAssign2.default)(styles.root, this.props.style),
zDepth: this.state.zDepth,
circle: true
},
_react2.default.createElement(
_EnhancedButton2.default,
_extends({}, other, buttonEventHandlers, {
ref: 'container',
disabled: disabled,
style: (0, _simpleAssign2.default)(styles.container, this.props.mini && styles.containerWhenMini, iconStyle),
focusRippleColor: styles.icon.color,
touchRippleColor: styles.icon.color
}),
_react2.default.createElement(
'div',
{
ref: 'overlay',
style: prepareStyles((0, _simpleAssign2.default)(styles.overlay, this.state.hovered && !this.props.disabled && styles.overlayWhenHovered))
},
iconElement,
children
)
)
);
}
}]);
return FloatingActionButton;
}(_react.Component);
FloatingActionButton.propTypes = {
/**
* This value will override the default background color for the button.
* However it will not override the default disabled background color.
* This has to be set separately using the disabledColor attribute.
*/
backgroundColor: _react.PropTypes.string,
/**
* This is what displayed inside the floating action button; for example, a SVG Icon.
*/
children: _react.PropTypes.node,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* Disables the button if set to true.
*/
disabled: _react.PropTypes.bool,
/**
* This value will override the default background color for the button when it is disabled.
*/
disabledColor: _react.PropTypes.string,
/**
* The URL to link to when the button is clicked.
*/
href: _react.PropTypes.string,
/**
* The icon within the FloatingActionButton is a FontIcon component.
* This property is the classname of the icon to be displayed inside the button.
* An alternative to adding an iconClassName would be to manually insert a
* FontIcon component or custom SvgIcon component or as a child of FloatingActionButton.
*/
iconClassName: _react.PropTypes.string,
/**
* This is the equivalent to iconClassName except that it is used for
* overriding the inline-styles of the FontIcon component.
*/
iconStyle: _react.PropTypes.object,
/**
* If true, the button will be a small floating action button.
*/
mini: _react.PropTypes.bool,
/**
* Callback function fired when a mouse button is pressed down on the element.
*
* @param {object} event `mousedown` event targeting the element.
*/
onMouseDown: _react.PropTypes.func,
/**
* Callback function fired when the mouse enters the element.
*
* @param {object} event `mouseenter` event targeting the element.
*/
onMouseEnter: _react.PropTypes.func,
/**
* Callback function fired when the mouse leaves the element.
*
* @param {object} event `mouseleave` event targeting the element.
*/
onMouseLeave: _react.PropTypes.func,
/**
* Callback function fired when a mouse button is released on the element.
*
* @param {object} event `mouseup` event targeting the element.
*/
onMouseUp: _react.PropTypes.func,
/**
* Callback function fired when a touch point is removed from the element.
*
* @param {object} event `touchend` event targeting the element.
*/
onTouchEnd: _react.PropTypes.func,
/**
* Callback function fired when the element is touched.
*
* @param {object} event `touchstart` event targeting the element.
*/
onTouchStart: _react.PropTypes.func,
/**
* If true, the button will use the secondary button colors.
*/
secondary: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The zDepth of the underlying `Paper` component.
*/
zDepth: _propTypes2.default.zDepth
};
FloatingActionButton.defaultProps = {
disabled: false,
mini: false,
secondary: false,
zDepth: 2
};
FloatingActionButton.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = FloatingActionButton;
/***/ },
/* 129 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _FloatingActionButton = __webpack_require__(128);
var _FloatingActionButton2 = _interopRequireDefault(_FloatingActionButton);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _FloatingActionButton2.default;
/***/ },
/* 130 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context, state) {
var color = props.color;
var hoverColor = props.hoverColor;
var baseTheme = context.muiTheme.baseTheme;
var offColor = color || baseTheme.palette.textColor;
var onColor = hoverColor || offColor;
return {
root: {
color: state.hovered ? onColor : offColor,
position: 'relative',
fontSize: baseTheme.spacing.iconSize,
display: 'inline-block',
userSelect: 'none',
transition: _transitions2.default.easeOut()
}
};
}
var FontIcon = function (_Component) {
_inherits(FontIcon, _Component);
function FontIcon() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, FontIcon);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(FontIcon)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
hovered: false
}, _this.handleMouseLeave = function (event) {
// hover is needed only when a hoverColor is defined
if (_this.props.hoverColor !== undefined) _this.setState({ hovered: false });
if (_this.props.onMouseLeave) {
_this.props.onMouseLeave(event);
}
}, _this.handleMouseEnter = function (event) {
// hover is needed only when a hoverColor is defined
if (_this.props.hoverColor !== undefined) _this.setState({ hovered: true });
if (_this.props.onMouseEnter) {
_this.props.onMouseEnter(event);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(FontIcon, [{
key: 'render',
value: function render() {
var _props = this.props;
var onMouseLeave = _props.onMouseLeave;
var // eslint-disable-line no-unused-vars
onMouseEnter = _props.onMouseEnter;
var // eslint-disable-line no-unused-vars
style = _props.style;
var other = _objectWithoutProperties(_props, ['onMouseLeave', 'onMouseEnter', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context, this.state);
return _react2.default.createElement('span', _extends({}, other, {
onMouseLeave: this.handleMouseLeave,
onMouseEnter: this.handleMouseEnter,
style: prepareStyles((0, _simpleAssign2.default)(styles.root, style))
}));
}
}]);
return FontIcon;
}(_react.Component);
FontIcon.muiName = 'FontIcon';
FontIcon.propTypes = {
/**
* This is the font color of the font icon. If not specified,
* this component will default to muiTheme.palette.textColor.
*/
color: _react.PropTypes.string,
/**
* This is the icon color when the mouse hovers over the icon.
*/
hoverColor: _react.PropTypes.string,
/**
* Callback function fired when the mouse enters the element.
*
* @param {object} event `mouseenter` event targeting the element.
*/
onMouseEnter: _react.PropTypes.func,
/**
* Callback function fired when the mouse leaves the element.
*
* @param {object} event `mouseleave` event targeting the element.
*/
onMouseLeave: _react.PropTypes.func,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
FontIcon.defaultProps = {
onMouseEnter: function onMouseEnter() {},
onMouseLeave: function onMouseLeave() {}
};
FontIcon.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = FontIcon;
/***/ },
/* 131 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props) {
return {
root: {
display: 'flex',
flexWrap: 'wrap',
margin: -props.padding / 2
},
item: {
boxSizing: 'border-box',
padding: props.padding / 2
}
};
}
var GridList = function (_Component) {
_inherits(GridList, _Component);
function GridList() {
_classCallCheck(this, GridList);
return _possibleConstructorReturn(this, Object.getPrototypeOf(GridList).apply(this, arguments));
}
_createClass(GridList, [{
key: 'render',
value: function render() {
var _props = this.props;
var cols = _props.cols;
var padding = _props.padding;
var cellHeight = _props.cellHeight;
var children = _props.children;
var style = _props.style;
var other = _objectWithoutProperties(_props, ['cols', 'padding', 'cellHeight', 'children', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var mergedRootStyles = (0, _simpleAssign2.default)(styles.root, style);
var wrappedChildren = _react2.default.Children.map(children, function (currentChild) {
if (_react2.default.isValidElement(currentChild) && currentChild.type.muiName === 'Subheader') {
return currentChild;
}
var childCols = currentChild.props.cols || 1;
var childRows = currentChild.props.rows || 1;
var itemStyle = (0, _simpleAssign2.default)({}, styles.item, {
width: 100 / cols * childCols + '%',
height: cellHeight * childRows + padding
});
return _react2.default.createElement(
'div',
{ style: prepareStyles(itemStyle) },
currentChild
);
});
return _react2.default.createElement(
'div',
_extends({ style: prepareStyles(mergedRootStyles) }, other),
wrappedChildren
);
}
}]);
return GridList;
}(_react.Component);
GridList.propTypes = {
/**
* Number of px for one cell height.
*/
cellHeight: _react.PropTypes.number,
/**
* Grid Tiles that will be in Grid List.
*/
children: _react.PropTypes.node,
/**
* Number of columns.
*/
cols: _react.PropTypes.number,
/**
* Number of px for the padding/spacing between items.
*/
padding: _react.PropTypes.number,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
GridList.defaultProps = {
cols: 2,
padding: 4,
cellHeight: 180
};
GridList.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = GridList;
/***/ },
/* 132 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.GridTile = exports.GridList = undefined;
var _GridList2 = __webpack_require__(131);
var _GridList3 = _interopRequireDefault(_GridList2);
var _GridTile2 = __webpack_require__(62);
var _GridTile3 = _interopRequireDefault(_GridTile2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.GridList = _GridList3.default;
exports.GridTile = _GridTile3.default;
exports.default = _GridList3.default;
/***/ },
/* 133 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _propTypes = __webpack_require__(9);
var _propTypes2 = _interopRequireDefault(_propTypes);
var _EnhancedButton = __webpack_require__(11);
var _EnhancedButton2 = _interopRequireDefault(_EnhancedButton);
var _FontIcon = __webpack_require__(34);
var _FontIcon2 = _interopRequireDefault(_FontIcon);
var _Tooltip = __webpack_require__(82);
var _Tooltip2 = _interopRequireDefault(_Tooltip);
var _childUtils = __webpack_require__(24);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var baseTheme = context.muiTheme.baseTheme;
return {
root: {
position: 'relative',
boxSizing: 'border-box',
overflow: 'visible',
transition: _transitions2.default.easeOut(),
padding: baseTheme.spacing.iconSize / 2,
width: baseTheme.spacing.iconSize * 2,
height: baseTheme.spacing.iconSize * 2,
fontSize: 0
},
tooltip: {
boxSizing: 'border-box'
},
icon: {
color: baseTheme.palette.textColor,
fill: baseTheme.palette.textColor
},
overlay: {
position: 'relative',
top: 0,
width: '100%',
height: '100%',
background: baseTheme.palette.disabledColor
},
disabled: {
color: baseTheme.palette.disabledColor,
fill: baseTheme.palette.disabledColor
}
};
}
var IconButton = function (_Component) {
_inherits(IconButton, _Component);
function IconButton() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, IconButton);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(IconButton)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
tooltipShown: false
}, _this.handleBlur = function (event) {
_this.hideTooltip();
if (_this.props.onBlur) _this.props.onBlur(event);
}, _this.handleFocus = function (event) {
_this.showTooltip();
if (_this.props.onFocus) _this.props.onFocus(event);
}, _this.handleMouseLeave = function (event) {
if (!_this.refs.button.isKeyboardFocused()) _this.hideTooltip();
if (_this.props.onMouseLeave) _this.props.onMouseLeave(event);
}, _this.handleMouseOut = function (event) {
if (_this.props.disabled) _this.hideTooltip();
if (_this.props.onMouseOut) _this.props.onMouseOut(event);
}, _this.handleMouseEnter = function (event) {
_this.showTooltip();
if (_this.props.onMouseEnter) _this.props.onMouseEnter(event);
}, _this.handleKeyboardFocus = function (event, keyboardFocused) {
if (keyboardFocused && !_this.props.disabled) {
_this.showTooltip();
if (_this.props.onFocus) _this.props.onFocus(event);
} else if (!_this.state.hovered) {
_this.hideTooltip();
if (_this.props.onBlur) _this.props.onBlur(event);
}
if (_this.props.onKeyboardFocus) _this.props.onKeyboardFocus(event, keyboardFocused);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(IconButton, [{
key: 'setKeyboardFocus',
value: function setKeyboardFocus() {
this.refs.button.setKeyboardFocus();
}
}, {
key: 'showTooltip',
value: function showTooltip() {
if (this.props.tooltip) {
this.setState({ tooltipShown: true });
}
}
}, {
key: 'hideTooltip',
value: function hideTooltip() {
if (this.props.tooltip) this.setState({ tooltipShown: false });
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var disabled = _props.disabled;
var disableTouchRipple = _props.disableTouchRipple;
var iconClassName = _props.iconClassName;
var tooltip = _props.tooltip;
var touch = _props.touch;
var iconStyle = _props.iconStyle;
var other = _objectWithoutProperties(_props, ['disabled', 'disableTouchRipple', 'iconClassName', 'tooltip', 'touch', 'iconStyle']);
var fonticon = void 0;
var styles = getStyles(this.props, this.context);
var tooltipPosition = this.props.tooltipPosition.split('-');
var tooltipElement = tooltip ? _react2.default.createElement(_Tooltip2.default, {
ref: 'tooltip',
label: tooltip,
show: this.state.tooltipShown,
touch: touch,
style: (0, _simpleAssign2.default)(styles.tooltip, this.props.tooltipStyles),
verticalPosition: tooltipPosition[0],
horizontalPosition: tooltipPosition[1]
}) : null;
if (iconClassName) {
var iconHoverColor = iconStyle.iconHoverColor;
var iconStyleFontIcon = _objectWithoutProperties(iconStyle, ['iconHoverColor']);
fonticon = _react2.default.createElement(
_FontIcon2.default,
{
className: iconClassName,
hoverColor: disabled ? null : iconHoverColor,
style: (0, _simpleAssign2.default)(styles.icon, disabled && styles.disabled, iconStyleFontIcon)
},
this.props.children
);
}
var childrenStyle = disabled ? (0, _simpleAssign2.default)({}, iconStyle, styles.disabled) : iconStyle;
return _react2.default.createElement(
_EnhancedButton2.default,
_extends({}, other, {
ref: 'button',
centerRipple: true,
disabled: disabled,
style: (0, _simpleAssign2.default)(styles.root, this.props.style),
disableTouchRipple: disableTouchRipple,
onBlur: this.handleBlur,
onFocus: this.handleFocus,
onMouseLeave: this.handleMouseLeave,
onMouseEnter: this.handleMouseEnter,
onMouseOut: this.handleMouseOut,
onKeyboardFocus: this.handleKeyboardFocus
}),
tooltipElement,
fonticon,
(0, _childUtils.extendChildren)(this.props.children, {
style: childrenStyle
})
);
}
}]);
return IconButton;
}(_react.Component);
IconButton.muiName = 'IconButton';
IconButton.propTypes = {
/**
* Can be used to pass a `FontIcon` element as the icon for the button.
*/
children: _react.PropTypes.node,
/**
* The CSS class name of the root element.
*/
className: _react.PropTypes.string,
/**
* If true, the element's ripple effect will be disabled.
*/
disableTouchRipple: _react.PropTypes.bool,
/**
* If true, the element will be disabled.
*/
disabled: _react.PropTypes.bool,
/**
* The URL to link to when the button is clicked.
*/
href: _react.PropTypes.string,
/**
* The CSS class name of the icon. Used for setting the icon with a stylesheet.
*/
iconClassName: _react.PropTypes.string,
/**
* Override the inline-styles of the icon element.
*/
iconStyle: _react.PropTypes.object,
/**
* Callback function fired when the element loses focus.
* @param {object} event `blur` event targeting the element.
*/
onBlur: _react.PropTypes.func,
/**
* Callback function fired when the element gains focus.
* @param {object} event `focus` event targeting the element.
*/
onFocus: _react.PropTypes.func,
/**
* Callback function fired when the element is focused or blurred by the keyboard.
*
* @param {object} event `focus` or `blur` event targeting the element.
* @param {boolean} keyboardFocused Indicates whether the element is focused.
*/
onKeyboardFocus: _react.PropTypes.func,
/**
* Callback function fired when the mouse enters the element.
*
* @param {object} event `mouseenter` event targeting the element.
*/
onMouseEnter: _react.PropTypes.func,
/**
* Callback function fired when the mouse leaves the element.
*
* @param {object} event `mouseleave` event targeting the element.
*/
onMouseLeave: _react.PropTypes.func,
/**
* Callback function fired when the mouse leaves the element. Unlike `onMouseLeave`,
* this callback will fire on disabled icon buttons.
*
* @param {object} event `mouseout` event targeting the element.
*/
onMouseOut: _react.PropTypes.func,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The text to supply to the element's tooltip.
*/
tooltip: _react.PropTypes.node,
/**
* The vertical and horizontal positions, respectively, of the element's tooltip.
* Possible values are: "bottom-center", "top-center", "bottom-right", "top-right",
* "bottom-left", and "top-left".
*/
tooltipPosition: _propTypes2.default.cornersAndCenter,
/**
* Override the inline-styles of the tooltip element.
*/
tooltipStyles: _react.PropTypes.object,
/**
* If true, increase the tooltip element's size. Useful for increasing tooltip
* readability on mobile devices.
*/
touch: _react.PropTypes.bool
};
IconButton.defaultProps = {
disabled: false,
disableTouchRipple: false,
iconStyle: {},
tooltipPosition: 'bottom-center',
touch: false
};
IconButton.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = IconButton;
/***/ },
/* 134 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactDom = __webpack_require__(4);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _events = __webpack_require__(47);
var _events2 = _interopRequireDefault(_events);
var _propTypes = __webpack_require__(9);
var _propTypes2 = _interopRequireDefault(_propTypes);
var _Menu = __webpack_require__(28);
var _Menu2 = _interopRequireDefault(_Menu);
var _Popover = __webpack_require__(18);
var _Popover2 = _interopRequireDefault(_Popover);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var IconMenu = function (_Component) {
_inherits(IconMenu, _Component);
function IconMenu() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, IconMenu);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(IconMenu)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
menuInitiallyKeyboardFocused: false,
open: false
}, _this.handleItemTouchTap = function (event, child) {
if (_this.props.touchTapCloseDelay !== 0 && !child.props.hasOwnProperty('menuItems')) {
(function () {
var isKeyboard = _events2.default.isKeyboard(event);
_this.timerCloseId = setTimeout(function () {
_this.close(isKeyboard ? 'enter' : 'itemTap', isKeyboard);
}, _this.props.touchTapCloseDelay);
})();
}
_this.props.onItemTouchTap(event, child);
}, _this.handleRequestClose = function (reason) {
_this.close(reason);
}, _this.handleEscKeyDownMenu = function (event) {
_this.close('escape', event);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(IconMenu, [{
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (nextProps.open != null) {
this.setState({
open: nextProps.open,
anchorEl: this.refs.iconMenuContainer
});
}
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
clearTimeout(this.timerCloseId);
}
}, {
key: 'isOpen',
value: function isOpen() {
return this.state.open;
}
}, {
key: 'close',
value: function close(reason, isKeyboard) {
var _this2 = this;
if (!this.state.open) {
return;
}
if (this.props.open !== null) {
this.props.onRequestChange(false, reason);
}
this.setState({ open: false }, function () {
// Set focus on the icon button when the menu close
if (isKeyboard) {
var iconButton = _this2.refs.iconButton;
_reactDom2.default.findDOMNode(iconButton).focus();
iconButton.setKeyboardFocus();
}
});
}
}, {
key: 'open',
value: function open(reason, event) {
if (this.props.open !== null) {
this.props.onRequestChange(true, reason);
return this.setState({
menuInitiallyKeyboardFocused: _events2.default.isKeyboard(event),
anchorEl: event.currentTarget
});
}
this.setState({
open: true,
menuInitiallyKeyboardFocused: _events2.default.isKeyboard(event),
anchorEl: event.currentTarget
});
event.preventDefault();
}
}, {
key: 'render',
value: function render() {
var _this3 = this;
var _props = this.props;
var anchorOrigin = _props.anchorOrigin;
var className = _props.className;
var iconButtonElement = _props.iconButtonElement;
var iconStyle = _props.iconStyle;
var onItemTouchTap = _props.onItemTouchTap;
var // eslint-disable-line no-unused-vars
onKeyboardFocus = _props.onKeyboardFocus;
var onMouseDown = _props.onMouseDown;
var onMouseLeave = _props.onMouseLeave;
var onMouseEnter = _props.onMouseEnter;
var onMouseUp = _props.onMouseUp;
var onTouchTap = _props.onTouchTap;
var menuStyle = _props.menuStyle;
var style = _props.style;
var targetOrigin = _props.targetOrigin;
var useLayerForClickAway = _props.useLayerForClickAway;
var other = _objectWithoutProperties(_props, ['anchorOrigin', 'className', 'iconButtonElement', 'iconStyle', 'onItemTouchTap', 'onKeyboardFocus', 'onMouseDown', 'onMouseLeave', 'onMouseEnter', 'onMouseUp', 'onTouchTap', 'menuStyle', 'style', 'targetOrigin', 'useLayerForClickAway']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var _state = this.state;
var open = _state.open;
var anchorEl = _state.anchorEl;
var styles = {
root: {
display: 'inline-block',
position: 'relative'
},
menu: {
position: 'relative'
}
};
var mergedRootStyles = (0, _simpleAssign2.default)(styles.root, style);
var mergedMenuStyles = (0, _simpleAssign2.default)(styles.menu, menuStyle);
var iconButton = _react2.default.cloneElement(iconButtonElement, {
onKeyboardFocus: onKeyboardFocus,
iconStyle: (0, _simpleAssign2.default)({}, iconStyle, iconButtonElement.props.iconStyle),
onTouchTap: function onTouchTap(event) {
_this3.open(_events2.default.isKeyboard(event) ? 'keyboard' : 'iconTap', event);
if (iconButtonElement.props.onTouchTap) iconButtonElement.props.onTouchTap(event);
},
ref: 'iconButton'
});
var menu = _react2.default.createElement(
_Menu2.default,
_extends({}, other, {
animateOpen: true,
initiallyKeyboardFocused: this.state.menuInitiallyKeyboardFocused,
onEscKeyDown: this.handleEscKeyDownMenu,
onItemTouchTap: this.handleItemTouchTap,
style: mergedMenuStyles
}),
this.props.children
);
return _react2.default.createElement(
'div',
{
ref: 'iconMenuContainer',
className: className,
onMouseDown: onMouseDown,
onMouseLeave: onMouseLeave,
onMouseEnter: onMouseEnter,
onMouseUp: onMouseUp,
onTouchTap: onTouchTap,
style: prepareStyles(mergedRootStyles)
},
iconButton,
_react2.default.createElement(
_Popover2.default,
{
anchorOrigin: anchorOrigin,
targetOrigin: targetOrigin,
open: open,
anchorEl: anchorEl,
childContextTypes: this.constructor.childContextTypes,
useLayerForClickAway: useLayerForClickAway,
onRequestClose: this.handleRequestClose,
context: this.context
},
menu
)
);
}
}]);
return IconMenu;
}(_react.Component);
IconMenu.muiName = 'IconMenu';
IconMenu.propTypes = {
/**
* This is the point on the icon where the menu
* `targetOrigin` will attach.
* Options:
* vertical: [top, middle, bottom]
* horizontal: [left, center, right].
*/
anchorOrigin: _propTypes2.default.origin,
/**
* Should be used to pass `MenuItem` components.
*/
children: _react.PropTypes.node,
/**
* The CSS class name of the root element.
*/
className: _react.PropTypes.string,
/**
* This is the `IconButton` to render. This button will open the menu.
*/
iconButtonElement: _react.PropTypes.element.isRequired,
/**
* Override the inline-styles of the underlying icon element.
*/
iconStyle: _react.PropTypes.object,
/**
* Override the inline-styles of the menu element.
*/
menuStyle: _react.PropTypes.object,
/**
* If true, the value can an be array and allow the menu to be a multi-select.
*/
multiple: _react.PropTypes.bool,
/**
* Callback function fired when a menu item is selected with a touch-tap.
*
* @param {object} event TouchTap event targeting the selected menu item element.
* @param {object} child The selected element.
*/
onItemTouchTap: _react.PropTypes.func,
/**
* Callback function fired when the `IconButton` element is focused or blurred by the keyboard.
*
* @param {object} event `focus` or `blur` event targeting the `IconButton` element.
* @param {boolean} keyboardFocused If true, the `IconButton` element is focused.
*/
onKeyboardFocus: _react.PropTypes.func,
/**
* Callback function fired when a mouse button is pressed down on the `IconButton` element.
*
* @param {object} event `mousedown` event targeting the `IconButton` element.
*/
onMouseDown: _react.PropTypes.func,
/**
* Callback function fired when the mouse enters the `IconButton` element.
*
* @param {object} event `mouseenter` event targeting the `IconButton` element.
*/
onMouseEnter: _react.PropTypes.func,
/**
* Callback function fired when the mouse leaves the `IconButton` element.
*
* @param {object} event `mouseleave` event targeting the `IconButton` element.
*/
onMouseLeave: _react.PropTypes.func,
/**
* Callback function fired when a mouse button is released on the `IconButton` element.
*
* @param {object} event `mouseup` event targeting the `IconButton` element.
*/
onMouseUp: _react.PropTypes.func,
/**
* Callback function fired when the `open` state of the menu is requested to be changed.
*
* @param {boolean} open If true, the menu was requested to be opened.
* @param {string} reason The reason for the open or close request. Possible values are
* 'keyboard' and 'iconTap' for open requests; 'enter', 'escape', 'itemTap', and 'clickAway'
* for close requests.
*/
onRequestChange: _react.PropTypes.func,
/**
* Callback function fired when the `IconButton` element is touch-tapped.
*
* @param {object} event TouchTap event targeting the `IconButton` element.
*/
onTouchTap: _react.PropTypes.func,
/**
* If true, the `IconMenu` is opened.
*/
open: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* This is the point on the menu which will stick to the menu
* origin.
* Options:
* vertical: [top, middle, bottom]
* horizontal: [left, center, right].
*/
targetOrigin: _propTypes2.default.origin,
/**
* Sets the delay in milliseconds before closing the
* menu when an item is clicked.
* If set to 0 then the auto close functionality
* will be disabled.
*/
touchTapCloseDelay: _react.PropTypes.number,
/**
* If true, the popover will render on top of an invisible
* layer, which will prevent clicks to the underlying elements.
*/
useLayerForClickAway: _react.PropTypes.bool
};
IconMenu.defaultProps = {
anchorOrigin: {
vertical: 'top',
horizontal: 'left'
},
multiple: false,
open: null,
onItemTouchTap: function onItemTouchTap() {},
onKeyboardFocus: function onKeyboardFocus() {},
onMouseDown: function onMouseDown() {},
onMouseLeave: function onMouseLeave() {},
onMouseEnter: function onMouseEnter() {},
onMouseUp: function onMouseUp() {},
onTouchTap: function onTouchTap() {},
onRequestChange: function onRequestChange() {},
targetOrigin: {
vertical: 'top',
horizontal: 'left'
},
touchTapCloseDelay: 200,
useLayerForClickAway: false
};
IconMenu.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = IconMenu;
/***/ },
/* 135 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.MenuItem = exports.IconMenu = undefined;
var _IconMenu2 = __webpack_require__(134);
var _IconMenu3 = _interopRequireDefault(_IconMenu2);
var _MenuItem2 = __webpack_require__(37);
var _MenuItem3 = _interopRequireDefault(_MenuItem2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.IconMenu = _IconMenu3.default;
exports.MenuItem = _MenuItem3.default;
exports.default = _IconMenu3.default;
/***/ },
/* 136 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getRelativeValue(value, min, max) {
var clampedValue = Math.min(Math.max(min, value), max);
var rangeValue = max - min;
var relValue = Math.round(clampedValue / rangeValue * 10000) / 10000;
return relValue * 100;
}
function getStyles(props, context) {
var max = props.max;
var min = props.min;
var value = props.value;
var palette = context.muiTheme.baseTheme.palette;
var styles = {
root: {
position: 'relative',
height: 4,
display: 'block',
width: '100%',
backgroundColor: palette.primary3Color,
borderRadius: 2,
margin: 0,
overflow: 'hidden'
},
bar: {
height: '100%'
},
barFragment1: {},
barFragment2: {}
};
if (props.mode === 'indeterminate') {
styles.barFragment1 = {
position: 'absolute',
backgroundColor: props.color || palette.primary1Color,
top: 0,
left: 0,
bottom: 0,
transition: _transitions2.default.create('all', '840ms', null, 'cubic-bezier(0.650, 0.815, 0.735, 0.395)')
};
styles.barFragment2 = {
position: 'absolute',
backgroundColor: props.color || palette.primary1Color,
top: 0,
left: 0,
bottom: 0,
transition: _transitions2.default.create('all', '840ms', null, 'cubic-bezier(0.165, 0.840, 0.440, 1.000)')
};
} else {
styles.bar.backgroundColor = props.color || palette.primary1Color;
styles.bar.transition = _transitions2.default.create('width', '.3s', null, 'linear');
styles.bar.width = getRelativeValue(value, min, max) + '%';
}
return styles;
}
var LinearProgress = function (_Component) {
_inherits(LinearProgress, _Component);
function LinearProgress() {
_classCallCheck(this, LinearProgress);
return _possibleConstructorReturn(this, Object.getPrototypeOf(LinearProgress).apply(this, arguments));
}
_createClass(LinearProgress, [{
key: 'componentDidMount',
value: function componentDidMount() {
var _this2 = this;
this.timers = {};
this.timers.bar1 = this.barUpdate('bar1', 0, this.refs.bar1, [[-35, 100], [100, -90]]);
this.timers.bar2 = setTimeout(function () {
_this2.barUpdate('bar2', 0, _this2.refs.bar2, [[-200, 100], [107, -8]]);
}, 850);
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
clearTimeout(this.timers.bar1);
clearTimeout(this.timers.bar2);
}
}, {
key: 'barUpdate',
value: function barUpdate(id, step, barElement, stepValues) {
var _this3 = this;
if (this.props.mode !== 'indeterminate') return;
step = step || 0;
step %= 4;
var right = this.context.muiTheme.isRtl ? 'left' : 'right';
var left = this.context.muiTheme.isRtl ? 'right' : 'left';
if (step === 0) {
barElement.style[left] = stepValues[0][0] + '%';
barElement.style[right] = stepValues[0][1] + '%';
} else if (step === 1) {
barElement.style.transitionDuration = '840ms';
} else if (step === 2) {
barElement.style[left] = stepValues[1][0] + '%';
barElement.style[right] = stepValues[1][1] + '%';
} else if (step === 3) {
barElement.style.transitionDuration = '0ms';
}
this.timers[id] = setTimeout(function () {
return _this3.barUpdate(id, step + 1, barElement, stepValues);
}, 420);
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var style = _props.style;
var other = _objectWithoutProperties(_props, ['style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
return _react2.default.createElement(
'div',
_extends({}, other, { style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) }),
_react2.default.createElement(
'div',
{ style: prepareStyles(styles.bar) },
_react2.default.createElement('div', { ref: 'bar1', style: prepareStyles(styles.barFragment1) }),
_react2.default.createElement('div', { ref: 'bar2', style: prepareStyles(styles.barFragment2) })
)
);
}
}]);
return LinearProgress;
}(_react.Component);
LinearProgress.propTypes = {
/**
* The mode of show your progress, indeterminate for
* when there is no value for progress.
*/
color: _react.PropTypes.string,
/**
* The max value of progress, only works in determinate mode.
*/
max: _react.PropTypes.number,
/**
* The min value of progress, only works in determinate mode.
*/
min: _react.PropTypes.number,
/**
* The mode of show your progress, indeterminate for when
* there is no value for progress.
*/
mode: _react.PropTypes.oneOf(['determinate', 'indeterminate']),
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The value of progress, only works in determinate mode.
*/
value: _react.PropTypes.number
};
LinearProgress.defaultProps = {
mode: 'indeterminate',
value: 0,
min: 0,
max: 100
};
LinearProgress.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = LinearProgress;
/***/ },
/* 137 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _LinearProgress = __webpack_require__(136);
var _LinearProgress2 = _interopRequireDefault(_LinearProgress);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _LinearProgress2.default;
/***/ },
/* 138 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _List = __webpack_require__(35);
var _List2 = _interopRequireDefault(_List);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var NestedList = function (_Component) {
_inherits(NestedList, _Component);
function NestedList() {
_classCallCheck(this, NestedList);
return _possibleConstructorReturn(this, Object.getPrototypeOf(NestedList).apply(this, arguments));
}
_createClass(NestedList, [{
key: 'render',
value: function render() {
var _props = this.props;
var children = _props.children;
var open = _props.open;
var nestedLevel = _props.nestedLevel;
var style = _props.style;
var styles = {
root: {
display: open ? null : 'none'
}
};
return _react2.default.createElement(
_List2.default,
{ style: (0, _simpleAssign2.default)({}, styles.root, style) },
_react2.default.Children.map(children, function (child) {
return _react2.default.isValidElement(child) ? _react2.default.cloneElement(child, {
nestedLevel: nestedLevel + 1
}) : child;
})
);
}
}]);
return NestedList;
}(_react.Component);
NestedList.propTypes = {
children: _react.PropTypes.node,
nestedLevel: _react.PropTypes.number,
open: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
NestedList.defaultProps = {
nestedLevel: 1,
open: false
};
exports.default = NestedList;
/***/ },
/* 139 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.MakeSelectable = exports.ListItem = exports.List = undefined;
var _List2 = __webpack_require__(35);
var _List3 = _interopRequireDefault(_List2);
var _ListItem2 = __webpack_require__(36);
var _ListItem3 = _interopRequireDefault(_ListItem2);
var _MakeSelectable2 = __webpack_require__(63);
var _MakeSelectable3 = _interopRequireDefault(_MakeSelectable2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.List = _List3.default;
exports.ListItem = _ListItem3.default;
exports.MakeSelectable = _MakeSelectable3.default;
exports.default = _List3.default;
/***/ },
/* 140 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _propTypes = __webpack_require__(9);
var _propTypes2 = _interopRequireDefault(_propTypes);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var circle = props.circle;
var rounded = props.rounded;
var transitionEnabled = props.transitionEnabled;
var zDepth = props.zDepth;
var _context$muiTheme = context.muiTheme;
var baseTheme = _context$muiTheme.baseTheme;
var paper = _context$muiTheme.paper;
return {
root: {
color: paper.color,
backgroundColor: paper.backgroundColor,
transition: transitionEnabled && _transitions2.default.easeOut(),
boxSizing: 'border-box',
fontFamily: baseTheme.fontFamily,
WebkitTapHighlightColor: 'rgba(0,0,0,0)', // Remove mobile color flashing (deprecated)
boxShadow: paper.zDepthShadows[zDepth - 1], // No shadow for 0 depth papers
borderRadius: circle ? '50%' : rounded ? '2px' : '0px'
}
};
}
var Paper = function (_Component) {
_inherits(Paper, _Component);
function Paper() {
_classCallCheck(this, Paper);
return _possibleConstructorReturn(this, Object.getPrototypeOf(Paper).apply(this, arguments));
}
_createClass(Paper, [{
key: 'render',
value: function render() {
var _props = this.props;
var children = _props.children;
var style = _props.style;
var other = _objectWithoutProperties(_props, ['children', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
return _react2.default.createElement(
'div',
_extends({}, other, { style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) }),
children
);
}
}]);
return Paper;
}(_react.Component);
Paper.propTypes = {
/**
* Children passed into the paper element.
*/
children: _react.PropTypes.node,
/**
* Set to true to generate a circlular paper container.
*/
circle: _react.PropTypes.bool,
/**
* By default, the paper container will have a border radius.
* Set this to false to generate a container with sharp corners.
*/
rounded: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* Set to false to disable CSS transitions for the paper element.
*/
transitionEnabled: _react.PropTypes.bool,
/**
* This number represents the zDepth of the paper shadow.
*/
zDepth: _propTypes2.default.zDepth
};
Paper.defaultProps = {
circle: false,
rounded: true,
transitionEnabled: true,
zDepth: 1
};
Paper.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = Paper;
/***/ },
/* 141 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _propTypes = __webpack_require__(9);
var _propTypes2 = _interopRequireDefault(_propTypes);
var _Paper = __webpack_require__(8);
var _Paper2 = _interopRequireDefault(_Paper);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context, state) {
var targetOrigin = props.targetOrigin;
var open = state.open;
var muiTheme = context.muiTheme;
var horizontal = targetOrigin.horizontal.replace('middle', 'vertical');
return {
root: {
opacity: open ? 1 : 0,
transform: open ? 'scale(1, 1)' : 'scale(0, 0)',
transformOrigin: horizontal + ' ' + targetOrigin.vertical,
position: 'fixed',
zIndex: muiTheme.zIndex.popover,
transition: _transitions2.default.easeOut('250ms', ['transform', 'opacity']),
maxHeight: '100%'
},
horizontal: {
maxHeight: '100%',
overflowY: 'auto',
transform: open ? 'scaleX(1)' : 'scaleX(0)',
opacity: open ? 1 : 0,
transformOrigin: horizontal + ' ' + targetOrigin.vertical,
transition: _transitions2.default.easeOut('250ms', ['transform', 'opacity'])
},
vertical: {
opacity: open ? 1 : 0,
transform: open ? 'scaleY(1)' : 'scaleY(0)',
transformOrigin: horizontal + ' ' + targetOrigin.vertical,
transition: _transitions2.default.easeOut('500ms', ['transform', 'opacity'])
}
};
}
var PopoverDefaultAnimation = function (_Component) {
_inherits(PopoverDefaultAnimation, _Component);
function PopoverDefaultAnimation() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, PopoverDefaultAnimation);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(PopoverDefaultAnimation)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
open: false
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(PopoverDefaultAnimation, [{
key: 'componentDidMount',
value: function componentDidMount() {
this.setState({ open: true }); // eslint-disable-line react/no-did-mount-set-state
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
this.setState({
open: nextProps.open
});
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var className = _props.className;
var style = _props.style;
var zDepth = _props.zDepth;
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context, this.state);
return _react2.default.createElement(
_Paper2.default,
{
style: (0, _simpleAssign2.default)(styles.root, style),
zDepth: zDepth,
className: className
},
_react2.default.createElement(
'div',
{ style: prepareStyles(styles.horizontal) },
_react2.default.createElement(
'div',
{ style: prepareStyles(styles.vertical) },
this.props.children
)
)
);
}
}]);
return PopoverDefaultAnimation;
}(_react.Component);
PopoverDefaultAnimation.propTypes = {
children: _react.PropTypes.node,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
open: _react.PropTypes.bool.isRequired,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
targetOrigin: _propTypes2.default.origin,
zDepth: _propTypes2.default.zDepth
};
PopoverDefaultAnimation.defaultProps = {
style: {},
zDepth: 1
};
PopoverDefaultAnimation.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = PopoverDefaultAnimation;
/***/ },
/* 142 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.PopoverAnimationVertical = exports.Popover = undefined;
var _Popover2 = __webpack_require__(18);
var _Popover3 = _interopRequireDefault(_Popover2);
var _PopoverAnimationVertical2 = __webpack_require__(39);
var _PopoverAnimationVertical3 = _interopRequireDefault(_PopoverAnimationVertical2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.Popover = _Popover3.default;
exports.PopoverAnimationVertical = _PopoverAnimationVertical3.default;
exports.default = _Popover3.default;
/***/ },
/* 143 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _EnhancedSwitch = __webpack_require__(42);
var _EnhancedSwitch2 = _interopRequireDefault(_EnhancedSwitch);
var _radioButtonUnchecked = __webpack_require__(210);
var _radioButtonUnchecked2 = _interopRequireDefault(_radioButtonUnchecked);
var _radioButtonChecked = __webpack_require__(209);
var _radioButtonChecked2 = _interopRequireDefault(_radioButtonChecked);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var radioButton = context.muiTheme.radioButton;
return {
icon: {
height: radioButton.size,
width: radioButton.size
},
target: {
transition: _transitions2.default.easeOut(),
position: 'absolute',
opacity: 1,
transform: 'scale(1)',
fill: radioButton.borderColor
},
fill: {
position: 'absolute',
opacity: 1,
transform: 'scale(0)',
transformOrigin: '50% 50%',
transition: _transitions2.default.easeOut(),
fill: radioButton.checkedColor
},
targetWhenChecked: {
opacity: 0,
transform: 'scale(0)'
},
fillWhenChecked: {
opacity: 1,
transform: 'scale(1)'
},
targetWhenDisabled: {
fill: radioButton.disabledColor
},
fillWhenDisabled: {
fill: radioButton.disabledColor
},
label: {
color: props.disabled ? radioButton.labelDisabledColor : radioButton.labelColor
},
ripple: {
color: props.checked ? radioButton.checkedColor : radioButton.borderColor
}
};
}
var RadioButton = function (_Component) {
_inherits(RadioButton, _Component);
function RadioButton() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, RadioButton);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(RadioButton)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.handleStateChange = function () {}, _this.handleSwitch = function (event) {
if (_this.props.onCheck) _this.props.onCheck(event, _this.props.value);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
// Only called when selected, not when unselected.
_createClass(RadioButton, [{
key: 'isChecked',
value: function isChecked() {
return this.refs.enhancedSwitch.isSwitched();
}
// Use RadioButtonGroup.setSelectedValue(newSelectionValue) to set a
// RadioButton's checked value.
}, {
key: 'setChecked',
value: function setChecked(newCheckedValue) {
this.refs.enhancedSwitch.setSwitched(newCheckedValue);
}
}, {
key: 'getValue',
value: function getValue() {
return this.refs.enhancedSwitch.getValue();
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var checkedIcon = _props.checkedIcon;
var checked = _props.checked;
var iconStyle = _props.iconStyle;
var labelStyle = _props.labelStyle;
var labelPosition = _props.labelPosition;
var onCheck = _props.onCheck;
var // eslint-disable-line no-unused-vars
uncheckedIcon = _props.uncheckedIcon;
var disabled = _props.disabled;
var other = _objectWithoutProperties(_props, ['checkedIcon', 'checked', 'iconStyle', 'labelStyle', 'labelPosition', 'onCheck', 'uncheckedIcon', 'disabled']);
var styles = getStyles(this.props, this.context);
var uncheckedStyles = (0, _simpleAssign2.default)(styles.target, checked && styles.targetWhenChecked, iconStyle, disabled && styles.targetWhenDisabled);
var checkedStyles = (0, _simpleAssign2.default)(styles.fill, checked && styles.fillWhenChecked, iconStyle, disabled && styles.fillWhenDisabled);
var uncheckedElement = _react2.default.isValidElement(uncheckedIcon) ? _react2.default.cloneElement(uncheckedIcon, {
style: (0, _simpleAssign2.default)(uncheckedStyles, uncheckedIcon.props.style)
}) : _react2.default.createElement(_radioButtonUnchecked2.default, { style: uncheckedStyles });
var checkedElement = _react2.default.isValidElement(checkedIcon) ? _react2.default.cloneElement(checkedIcon, {
style: (0, _simpleAssign2.default)(checkedStyles, checkedIcon.props.style)
}) : _react2.default.createElement(_radioButtonChecked2.default, { style: checkedStyles });
var mergedIconStyle = (0, _simpleAssign2.default)(styles.icon, iconStyle);
var mergedLabelStyle = (0, _simpleAssign2.default)(styles.label, labelStyle);
return _react2.default.createElement(_EnhancedSwitch2.default, _extends({}, other, {
ref: 'enhancedSwitch',
inputType: 'radio',
checked: checked,
switched: checked,
disabled: disabled,
rippleColor: styles.ripple.color,
iconStyle: mergedIconStyle,
labelStyle: mergedLabelStyle,
labelPosition: labelPosition,
onParentShouldUpdate: this.handleStateChange,
onSwitch: this.handleSwitch,
switchElement: _react2.default.createElement(
'div',
null,
uncheckedElement,
checkedElement
)
}));
}
}]);
return RadioButton;
}(_react.Component);
RadioButton.propTypes = {
/**
* @ignore
* checked if true
* Used internally by `RadioButtonGroup`.
*/
checked: _react.PropTypes.bool,
/**
* The icon element to show when the radio button is checked.
*/
checkedIcon: _react.PropTypes.element,
/**
* If true, the radio button is disabled.
*/
disabled: _react.PropTypes.bool,
/**
* Override the inline-styles of the icon element.
*/
iconStyle: _react.PropTypes.object,
/**
* Override the inline-styles of the input element.
*/
inputStyle: _react.PropTypes.object,
/**
* @ignore
* Used internally by `RadioButtonGroup`. Use the `labelPosition` property of `RadioButtonGroup` instead.
* Where the label will be placed next to the radio button.
*/
labelPosition: _react.PropTypes.oneOf(['left', 'right']),
/**
* Override the inline-styles of the label element.
*/
labelStyle: _react.PropTypes.object,
/**
* @ignore
* Callback function fired when the radio button is checked. Note that this
* function will not be called if the radio button is part of a
* radio button group: in this case, use the `onChange` property of
* `RadioButtonGroup`.
*
* @param {object} event `change` event targeting the element.
* @param {string} value The element's `value`.
*/
onCheck: _react.PropTypes.func,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The icon element to show when the radio button is unchecked.
*/
uncheckedIcon: _react.PropTypes.element,
/**
* The value of the radio button.
*/
value: _react.PropTypes.string
};
RadioButton.defaultProps = {
checked: false,
disabled: false,
labelPosition: 'right'
};
RadioButton.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = RadioButton;
/***/ },
/* 144 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _colorManipulator = __webpack_require__(12);
var _childUtils = __webpack_require__(24);
var _EnhancedButton = __webpack_require__(11);
var _EnhancedButton2 = _interopRequireDefault(_EnhancedButton);
var _Paper = __webpack_require__(8);
var _Paper2 = _interopRequireDefault(_Paper);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function validateLabel(props, propName, componentName) {
if (!props.children && !props.label && !props.icon) {
return new Error('Required prop label or children or icon was not specified in ' + componentName + '.');
}
}
function getStyles(props, context, state) {
var _context$muiTheme = context.muiTheme;
var baseTheme = _context$muiTheme.baseTheme;
var button = _context$muiTheme.button;
var raisedButton = _context$muiTheme.raisedButton;
var disabled = props.disabled;
var disabledBackgroundColor = props.disabledBackgroundColor;
var disabledLabelColor = props.disabledLabelColor;
var fullWidth = props.fullWidth;
var icon = props.icon;
var label = props.label;
var labelPosition = props.labelPosition;
var primary = props.primary;
var secondary = props.secondary;
var style = props.style;
var amount = primary || secondary ? 0.4 : 0.08;
var backgroundColor = raisedButton.color;
var labelColor = raisedButton.textColor;
if (disabled) {
backgroundColor = disabledBackgroundColor || raisedButton.disabledColor;
labelColor = disabledLabelColor || raisedButton.disabledTextColor;
} else if (primary) {
backgroundColor = raisedButton.primaryColor;
labelColor = raisedButton.primaryTextColor;
} else if (secondary) {
backgroundColor = raisedButton.secondaryColor;
labelColor = raisedButton.secondaryTextColor;
} else {
if (props.backgroundColor) {
backgroundColor = props.backgroundColor;
}
if (props.labelColor) {
labelColor = props.labelColor;
}
}
var buttonHeight = style && style.height || button.height;
var borderRadius = 2;
return {
root: {
display: 'inline-block',
transition: _transitions2.default.easeOut()
},
button: {
position: 'relative',
minWidth: fullWidth ? '100%' : button.minWidth,
height: buttonHeight,
lineHeight: buttonHeight + 'px',
width: '100%',
padding: 0,
borderRadius: borderRadius,
transition: _transitions2.default.easeOut(),
backgroundColor: backgroundColor,
// That's the default value for a button but not a link
textAlign: 'center'
},
label: {
position: 'relative',
opacity: 1,
fontSize: raisedButton.fontSize,
letterSpacing: 0,
textTransform: raisedButton.textTransform || button.textTransform || 'uppercase',
fontWeight: raisedButton.fontWeight,
margin: 0,
userSelect: 'none',
paddingLeft: icon && labelPosition !== 'before' ? 8 : baseTheme.spacing.desktopGutterLess,
paddingRight: icon && labelPosition === 'before' ? 8 : baseTheme.spacing.desktopGutterLess,
color: labelColor
},
icon: {
verticalAlign: 'middle',
marginLeft: label && labelPosition !== 'before' ? 12 : 0,
marginRight: label && labelPosition === 'before' ? 12 : 0
},
overlay: {
height: buttonHeight,
borderRadius: borderRadius,
backgroundColor: (state.keyboardFocused || state.hovered) && !disabled && (0, _colorManipulator.fade)(labelColor, amount),
transition: _transitions2.default.easeOut(),
top: 0
},
ripple: {
color: labelColor,
opacity: !(primary || secondary) ? 0.1 : 0.16
}
};
}
var RaisedButton = function (_Component) {
_inherits(RaisedButton, _Component);
function RaisedButton() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, RaisedButton);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(RaisedButton)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
hovered: false,
keyboardFocused: false,
touched: false,
initialZDepth: 0,
zDepth: 0
}, _this.handleMouseDown = function (event) {
// only listen to left clicks
if (event.button === 0) {
_this.setState({
zDepth: _this.state.initialZDepth + 1
});
}
if (_this.props.onMouseDown) {
_this.props.onMouseDown(event);
}
}, _this.handleMouseUp = function (event) {
_this.setState({
zDepth: _this.state.initialZDepth
});
if (_this.props.onMouseUp) {
_this.props.onMouseUp(event);
}
}, _this.handleMouseLeave = function (event) {
if (!_this.state.keyboardFocused) {
_this.setState({
zDepth: _this.state.initialZDepth,
hovered: false
});
}
if (_this.props.onMouseLeave) {
_this.props.onMouseLeave(event);
}
}, _this.handleMouseEnter = function (event) {
if (!_this.state.keyboardFocused && !_this.state.touched) {
_this.setState({ hovered: true });
}
if (_this.props.onMouseEnter) {
_this.props.onMouseEnter(event);
}
}, _this.handleTouchStart = function (event) {
_this.setState({
touched: true,
zDepth: _this.state.initialZDepth + 1
});
if (_this.props.onTouchStart) {
_this.props.onTouchStart(event);
}
}, _this.handleTouchEnd = function (event) {
_this.setState({
zDepth: _this.state.initialZDepth
});
if (_this.props.onTouchEnd) {
_this.props.onTouchEnd(event);
}
}, _this.handleKeyboardFocus = function (event, keyboardFocused) {
var zDepth = keyboardFocused && !_this.props.disabled ? _this.state.initialZDepth + 1 : _this.state.initialZDepth;
_this.setState({
zDepth: zDepth,
keyboardFocused: keyboardFocused
});
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(RaisedButton, [{
key: 'componentWillMount',
value: function componentWillMount() {
var zDepth = this.props.disabled ? 0 : 1;
this.setState({
zDepth: zDepth,
initialZDepth: zDepth
});
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
var zDepth = nextProps.disabled ? 0 : 1;
this.setState({
zDepth: zDepth,
initialZDepth: zDepth
});
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var children = _props.children;
var className = _props.className;
var disabled = _props.disabled;
var icon = _props.icon;
var label = _props.label;
var labelPosition = _props.labelPosition;
var labelStyle = _props.labelStyle;
var primary = _props.primary;
var // eslint-disable-line no-unused-vars
rippleStyle = _props.rippleStyle;
var secondary = _props.secondary;
var other = _objectWithoutProperties(_props, ['children', 'className', 'disabled', 'icon', 'label', 'labelPosition', 'labelStyle', 'primary', 'rippleStyle', 'secondary']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context, this.state);
var mergedRippleStyles = (0, _simpleAssign2.default)({}, styles.ripple, rippleStyle);
var buttonEventHandlers = disabled ? {} : {
onMouseDown: this.handleMouseDown,
onMouseUp: this.handleMouseUp,
onMouseLeave: this.handleMouseLeave,
onMouseEnter: this.handleMouseEnter,
onTouchStart: this.handleTouchStart,
onTouchEnd: this.handleTouchEnd,
onKeyboardFocus: this.handleKeyboardFocus
};
var labelElement = label && _react2.default.createElement(
'span',
{ style: prepareStyles((0, _simpleAssign2.default)(styles.label, labelStyle)) },
label
);
var iconCloned = icon && _react2.default.cloneElement(icon, {
color: styles.label.color,
style: styles.icon
});
// Place label before or after children.
var childrenFragment = labelPosition === 'before' ? {
labelElement: labelElement,
iconCloned: iconCloned,
children: children
} : {
children: children,
iconCloned: iconCloned,
labelElement: labelElement
};
var enhancedButtonChildren = (0, _childUtils.createChildFragment)(childrenFragment);
return _react2.default.createElement(
_Paper2.default,
{
className: className,
style: (0, _simpleAssign2.default)(styles.root, this.props.style),
zDepth: this.state.zDepth
},
_react2.default.createElement(
_EnhancedButton2.default,
_extends({}, other, buttonEventHandlers, {
ref: 'container',
disabled: disabled,
style: styles.button,
focusRippleColor: mergedRippleStyles.color,
touchRippleColor: mergedRippleStyles.color,
focusRippleOpacity: mergedRippleStyles.opacity,
touchRippleOpacity: mergedRippleStyles.opacity
}),
_react2.default.createElement(
'div',
{
ref: 'overlay',
style: prepareStyles(styles.overlay)
},
enhancedButtonChildren
)
)
);
}
}]);
return RaisedButton;
}(_react.Component);
RaisedButton.muiName = 'RaisedButton';
RaisedButton.propTypes = {
/**
* Override the default background color for the button,
* but not the default disabled background color
* (use `disabledBackgroundColor` for this).
*/
backgroundColor: _react.PropTypes.string,
/**
* The content of the button.
* If a label is provided via the `label` prop, the text within the label
* will be displayed in addition to the content provided here.
*/
children: _react.PropTypes.node,
/**
* The CSS class name of the root element.
*/
className: _react.PropTypes.string,
/**
* If true, the button will be disabled.
*/
disabled: _react.PropTypes.bool,
/**
* Override the default background color for the button
* when it is disabled.
*/
disabledBackgroundColor: _react.PropTypes.string,
/**
* The color of the button's label when the button is disabled.
*/
disabledLabelColor: _react.PropTypes.string,
/**
* If true, the button will take up the full width of its container.
*/
fullWidth: _react.PropTypes.bool,
/**
* The URL to link to when the button is clicked.
*/
href: _react.PropTypes.string,
/**
* An icon to be displayed within the button.
*/
icon: _react.PropTypes.node,
/**
* The label to be displayed within the button.
* If content is provided via the `children` prop, that content will be
* displayed in addition to the label provided here.
*/
label: validateLabel,
/**
* The color of the button's label.
*/
labelColor: _react.PropTypes.string,
/**
* The position of the button's label relative to the button's `children`.
*/
labelPosition: _react.PropTypes.oneOf(['before', 'after']),
/**
* Override the inline-styles of the button's label element.
*/
labelStyle: _react.PropTypes.object,
/**
* Callback function fired when a mouse button is pressed down on
* the element.
*
* @param {object} event `mousedown` event targeting the element.
*/
onMouseDown: _react.PropTypes.func,
/**
* Callback function fired when the mouse enters the element.
*
* @param {object} event `mouseenter` event targeting the element.
*/
onMouseEnter: _react.PropTypes.func,
/**
* Callback function fired when the mouse leaves the element.
*
* @param {object} event `mouseleave` event targeting the element.
*/
onMouseLeave: _react.PropTypes.func,
/**
* Callback function fired when a mouse button is released on the element.
*
* @param {object} event `mouseup` event targeting the element.
*/
onMouseUp: _react.PropTypes.func,
/**
* Callback function fired when a touch point is removed from the element.
*
* @param {object} event `touchend` event targeting the element.
*/
onTouchEnd: _react.PropTypes.func,
/**
* Callback function fired when the element is touched.
*
* @param {object} event `touchstart` event targeting the element.
*/
onTouchStart: _react.PropTypes.func,
/**
* If true, the button will use the theme's primary color.
*/
primary: _react.PropTypes.bool,
/**
* Override the inline style of the ripple element.
*/
rippleStyle: _react.PropTypes.object,
/**
* If true, the button will use the theme's secondary color.
* If both `secondary` and `primary` are true, the button will use
* the theme's primary color.
*/
secondary: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
RaisedButton.defaultProps = {
disabled: false,
labelPosition: 'after',
fullWidth: false,
primary: false,
secondary: false
};
RaisedButton.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = RaisedButton;
/***/ },
/* 145 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _RaisedButton = __webpack_require__(144);
var _RaisedButton2 = _interopRequireDefault(_RaisedButton);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _RaisedButton2.default;
/***/ },
/* 146 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _autoPrefix = __webpack_require__(14);
var _autoPrefix2 = _interopRequireDefault(_autoPrefix);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _Paper = __webpack_require__(8);
var _Paper2 = _interopRequireDefault(_Paper);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var VIEWBOX_SIZE = 32;
function getStyles(props) {
var padding = props.size * 0.1; // same implementation of `this.getPaddingSize()`
return {
root: {
position: 'absolute',
zIndex: 2,
width: props.size,
height: props.size,
padding: padding,
top: -10000,
left: -10000,
transform: 'translate3d(' + (10000 + props.left) + 'px, ' + (10000 + props.top) + 'px, 0)',
opacity: props.status === 'hide' ? 0 : 1,
transition: props.status === 'hide' ? _transitions2.default.create('all', '.3s', 'ease-out') : 'none'
}
};
}
var RefreshIndicator = function (_Component) {
_inherits(RefreshIndicator, _Component);
function RefreshIndicator() {
_classCallCheck(this, RefreshIndicator);
return _possibleConstructorReturn(this, Object.getPrototypeOf(RefreshIndicator).apply(this, arguments));
}
_createClass(RefreshIndicator, [{
key: 'componentDidMount',
value: function componentDidMount() {
this.scalePath(this.refs.path, 0);
this.rotateWrapper(this.refs.wrapper);
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
clearTimeout(this.scalePathTimer);
clearTimeout(this.rotateWrapperTimer);
clearTimeout(this.rotateWrapperSecondTimer);
this.scalePath(this.refs.path, 0);
this.rotateWrapper(this.refs.wrapper);
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
clearTimeout(this.scalePathTimer);
clearTimeout(this.rotateWrapperTimer);
clearTimeout(this.rotateWrapperSecondTimer);
}
}, {
key: 'renderChildren',
value: function renderChildren() {
var prepareStyles = this.context.muiTheme.prepareStyles;
var paperSize = this.getPaperSize();
var childrenCmp = null;
if (this.props.status !== 'ready') {
var circleStyle = this.getCircleStyle(paperSize);
childrenCmp = _react2.default.createElement(
'div',
{
ref: 'wrapper',
style: prepareStyles({
transition: _transitions2.default.create('transform', '20s', null, 'linear'),
width: '100%',
height: '100%'
})
},
_react2.default.createElement(
'svg',
{
style: {
width: paperSize,
height: paperSize
},
viewBox: '0 0 ' + VIEWBOX_SIZE + ' ' + VIEWBOX_SIZE
},
_react2.default.createElement('circle', _extends({
ref: 'path',
style: prepareStyles((0, _simpleAssign2.default)(circleStyle.style, {
transition: _transitions2.default.create('all', '1.5s', null, 'ease-in-out')
}))
}, circleStyle.attr))
)
);
} else {
var _circleStyle = this.getCircleStyle(paperSize);
var polygonStyle = this.getPolygonStyle(paperSize);
childrenCmp = _react2.default.createElement(
'svg',
{
style: {
width: paperSize,
height: paperSize
},
viewBox: '0 0 ' + VIEWBOX_SIZE + ' ' + VIEWBOX_SIZE
},
_react2.default.createElement('circle', _extends({
style: prepareStyles(_circleStyle.style)
}, _circleStyle.attr)),
_react2.default.createElement('polygon', _extends({
style: prepareStyles(polygonStyle.style)
}, polygonStyle.attr))
);
}
return childrenCmp;
}
}, {
key: 'getTheme',
value: function getTheme() {
return this.context.muiTheme.refreshIndicator;
}
}, {
key: 'getPaddingSize',
value: function getPaddingSize() {
var padding = this.props.size * 0.1;
return padding;
}
}, {
key: 'getPaperSize',
value: function getPaperSize() {
return this.props.size - this.getPaddingSize() * 2;
}
}, {
key: 'getCircleAttr',
value: function getCircleAttr() {
return {
radiu: VIEWBOX_SIZE / 2 - 5,
originX: VIEWBOX_SIZE / 2,
originY: VIEWBOX_SIZE / 2,
strokeWidth: 3
};
}
}, {
key: 'getArcDeg',
value: function getArcDeg() {
var p = this.props.percentage / 100;
var beginDeg = p * 120;
var endDeg = p * 410;
return [beginDeg, endDeg];
}
}, {
key: 'getFactor',
value: function getFactor() {
var p = this.props.percentage / 100;
var p1 = Math.min(1, p / 0.4);
return p1;
}
}, {
key: 'getCircleStyle',
value: function getCircleStyle() {
var isLoading = this.props.status === 'loading';
var p1 = isLoading ? 1 : this.getFactor();
var circle = this.getCircleAttr();
var perimeter = Math.PI * 2 * circle.radiu;
var _getArcDeg = this.getArcDeg();
var _getArcDeg2 = _slicedToArray(_getArcDeg, 2);
var beginDeg = _getArcDeg2[0];
var endDeg = _getArcDeg2[1];
var arcLen = (endDeg - beginDeg) * perimeter / 360;
var dashOffset = -beginDeg * perimeter / 360;
var theme = this.getTheme();
return {
style: {
strokeDasharray: arcLen + ', ' + (perimeter - arcLen),
strokeDashoffset: dashOffset,
stroke: isLoading || this.props.percentage === 100 ? this.props.loadingColor || theme.loadingStrokeColor : this.props.color || theme.strokeColor,
strokeLinecap: 'round',
opacity: p1,
strokeWidth: circle.strokeWidth * p1,
fill: 'none'
},
attr: {
cx: circle.originX,
cy: circle.originY,
r: circle.radiu
}
};
}
}, {
key: 'getPolygonStyle',
value: function getPolygonStyle() {
var p1 = this.getFactor();
var circle = this.getCircleAttr();
var triangleCx = circle.originX + circle.radiu;
var triangleCy = circle.originY;
var dx = circle.strokeWidth * 7 / 4 * p1;
var trianglePath = triangleCx - dx + ',' + triangleCy + ' ' + (triangleCx + dx) + ',' + triangleCy + ' ' + triangleCx + ',' + (triangleCy + dx);
var _getArcDeg3 = this.getArcDeg();
var _getArcDeg4 = _slicedToArray(_getArcDeg3, 2);
var endDeg = _getArcDeg4[1];
var theme = this.getTheme();
return {
style: {
fill: this.props.percentage === 100 ? this.props.loadingColor || theme.loadingStrokeColor : this.props.color || theme.strokeColor,
transform: 'rotate(' + endDeg + 'deg)',
transformOrigin: circle.originX + 'px ' + circle.originY + 'px',
opacity: p1
},
attr: {
points: trianglePath
}
};
}
}, {
key: 'scalePath',
value: function scalePath(path, step) {
var _this2 = this;
if (this.props.status !== 'loading') return;
var currStep = (step || 0) % 3;
var circle = this.getCircleAttr();
var perimeter = Math.PI * 2 * circle.radiu;
var arcLen = perimeter * 0.64;
var strokeDasharray = void 0;
var strokeDashoffset = void 0;
var transitionDuration = void 0;
if (currStep === 0) {
strokeDasharray = '1, 200';
strokeDashoffset = 0;
transitionDuration = '0ms';
} else if (currStep === 1) {
strokeDasharray = arcLen + ', 200';
strokeDashoffset = -15;
transitionDuration = '750ms';
} else {
strokeDasharray = arcLen + ', 200';
strokeDashoffset = -(perimeter - 1);
transitionDuration = '850ms';
}
_autoPrefix2.default.set(path.style, 'strokeDasharray', strokeDasharray);
_autoPrefix2.default.set(path.style, 'strokeDashoffset', strokeDashoffset);
_autoPrefix2.default.set(path.style, 'transitionDuration', transitionDuration);
this.scalePathTimer = setTimeout(function () {
return _this2.scalePath(path, currStep + 1);
}, currStep ? 750 : 250);
}
}, {
key: 'rotateWrapper',
value: function rotateWrapper(wrapper) {
var _this3 = this;
if (this.props.status !== 'loading') return;
_autoPrefix2.default.set(wrapper.style, 'transform', null);
_autoPrefix2.default.set(wrapper.style, 'transform', 'rotate(0deg)');
_autoPrefix2.default.set(wrapper.style, 'transitionDuration', '0ms');
this.rotateWrapperSecondTimer = setTimeout(function () {
_autoPrefix2.default.set(wrapper.style, 'transform', 'rotate(1800deg)');
_autoPrefix2.default.set(wrapper.style, 'transitionDuration', '10s');
_autoPrefix2.default.set(wrapper.style, 'transitionTimingFunction', 'linear');
}, 50);
this.rotateWrapperTimer = setTimeout(function () {
return _this3.rotateWrapper(wrapper);
}, 10050);
}
}, {
key: 'render',
value: function render() {
var style = this.props.style;
var styles = getStyles(this.props, this.context);
return _react2.default.createElement(
_Paper2.default,
{
circle: true,
style: (0, _simpleAssign2.default)(styles.root, style),
ref: 'indicatorCt'
},
this.renderChildren()
);
}
}]);
return RefreshIndicator;
}(_react.Component);
RefreshIndicator.propTypes = {
/**
* Override the theme's color of the indicator while it's status is
* "ready" and it's percentage is less than 100.
*/
color: _react.PropTypes.string,
/**
* The absolute left position of the indicator in pixels.
*/
left: _react.PropTypes.number.isRequired,
/**
* Override the theme's color of the indicator while
* it's status is "loading" or when it's percentage is 100.
*/
loadingColor: _react.PropTypes.string,
/**
* The confirmation progress to fetch data. Max value is 100.
*/
percentage: _react.PropTypes.number,
/**
* Size in pixels.
*/
size: _react.PropTypes.number,
/**
* The display status of the indicator. If the status is
* "ready", the indicator will display the ready state
* arrow. If the status is "loading", it will display
* the loading progress indicator. If the status is "hide",
* the indicator will be hidden.
*/
status: _react.PropTypes.oneOf(['ready', 'loading', 'hide']),
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The absolute top position of the indicator in pixels.
*/
top: _react.PropTypes.number.isRequired
};
RefreshIndicator.defaultProps = {
percentage: 0,
size: 40,
status: 'hide'
};
RefreshIndicator.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = RefreshIndicator;
/***/ },
/* 147 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _RefreshIndicator = __webpack_require__(146);
var _RefreshIndicator2 = _interopRequireDefault(_RefreshIndicator);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _RefreshIndicator2.default;
/***/ },
/* 148 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _TextField = __webpack_require__(21);
var _TextField2 = _interopRequireDefault(_TextField);
var _DropDownMenu = __webpack_require__(61);
var _DropDownMenu2 = _interopRequireDefault(_DropDownMenu);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props) {
return {
label: {
paddingLeft: 0,
top: props.floatingLabelText ? 6 : -4
},
icon: {
right: 0,
top: props.floatingLabelText ? 22 : 14
},
hideDropDownUnderline: {
borderTop: 'none'
}
};
}
var SelectField = function (_Component) {
_inherits(SelectField, _Component);
function SelectField() {
_classCallCheck(this, SelectField);
return _possibleConstructorReturn(this, Object.getPrototypeOf(SelectField).apply(this, arguments));
}
_createClass(SelectField, [{
key: 'render',
value: function render() {
var _props = this.props;
var autoWidth = _props.autoWidth;
var children = _props.children;
var style = _props.style;
var labelStyle = _props.labelStyle;
var iconStyle = _props.iconStyle;
var id = _props.id;
var underlineDisabledStyle = _props.underlineDisabledStyle;
var underlineFocusStyle = _props.underlineFocusStyle;
var underlineStyle = _props.underlineStyle;
var errorStyle = _props.errorStyle;
var selectFieldRoot = _props.selectFieldRoot;
var disabled = _props.disabled;
var floatingLabelText = _props.floatingLabelText;
var floatingLabelStyle = _props.floatingLabelStyle;
var hintStyle = _props.hintStyle;
var hintText = _props.hintText;
var fullWidth = _props.fullWidth;
var errorText = _props.errorText;
var onFocus = _props.onFocus;
var onBlur = _props.onBlur;
var onChange = _props.onChange;
var value = _props.value;
var other = _objectWithoutProperties(_props, ['autoWidth', 'children', 'style', 'labelStyle', 'iconStyle', 'id', 'underlineDisabledStyle', 'underlineFocusStyle', 'underlineStyle', 'errorStyle', 'selectFieldRoot', 'disabled', 'floatingLabelText', 'floatingLabelStyle', 'hintStyle', 'hintText', 'fullWidth', 'errorText', 'onFocus', 'onBlur', 'onChange', 'value']);
var styles = getStyles(this.props, this.context);
return _react2.default.createElement(
_TextField2.default,
{
style: style,
floatingLabelText: floatingLabelText,
floatingLabelStyle: floatingLabelStyle,
hintStyle: hintStyle,
hintText: !hintText && !floatingLabelText ? ' ' : hintText,
fullWidth: fullWidth,
errorText: errorText,
underlineStyle: underlineStyle,
errorStyle: errorStyle,
onFocus: onFocus,
onBlur: onBlur,
id: id,
underlineDisabledStyle: underlineDisabledStyle,
underlineFocusStyle: underlineFocusStyle
},
_react2.default.createElement(
_DropDownMenu2.default,
_extends({
disabled: disabled,
style: selectFieldRoot,
labelStyle: (0, _simpleAssign2.default)(styles.label, labelStyle),
iconStyle: (0, _simpleAssign2.default)(styles.icon, iconStyle),
underlineStyle: styles.hideDropDownUnderline,
autoWidth: autoWidth,
value: value,
onChange: onChange
}, other),
children
)
);
}
}]);
return SelectField;
}(_react.Component);
SelectField.propTypes = {
/**
* If true, the width will automatically be set according to the
* items inside the menu.
* To control the width in CSS instead, leave this prop set to `false`.
*/
autoWidth: _react.PropTypes.bool,
/**
* The `MenuItem` elements to populate the select field with.
* If the menu items have a `label` prop, that value will
* represent the selected menu item in the rendered select field.
*/
children: _react.PropTypes.node,
/**
* If true, the select field will be disabled.
*/
disabled: _react.PropTypes.bool,
/**
* Override the inline-styles of the error element.
*/
errorStyle: _react.PropTypes.object,
/**
* The error content to display.
*/
errorText: _react.PropTypes.node,
/**
* Override the inline-styles of the floating label.
*/
floatingLabelStyle: _react.PropTypes.object,
/**
* The content of the floating label.
*/
floatingLabelText: _react.PropTypes.node,
/**
* If true, the select field will take up the full width of its container.
*/
fullWidth: _react.PropTypes.bool,
/**
* Override the inline-styles of the hint element.
*/
hintStyle: _react.PropTypes.object,
/**
* The hint content to display.
*/
hintText: _react.PropTypes.node,
/**
* Override the inline-styles of the icon element.
*/
iconStyle: _react.PropTypes.object,
/**
* The id prop for the text field.
*/
id: _react.PropTypes.string,
/**
* Override the label style when the select field is inactive.
*/
labelStyle: _react.PropTypes.object,
/**
* Callback function fired when the select field loses focus.
*
* @param {object} event `blur` event targeting the select field.
*/
onBlur: _react.PropTypes.func,
/**
* Callback function fired when a menu item is selected.
*
* @param {object} event TouchTap event targeting the menu item
* that was selected.
* @param {number} key The index of the selected menu item.
* @param {any} payload The `value` prop of the selected menu item.
*/
onChange: _react.PropTypes.func,
/**
* Callback function fired when the select field gains focus.
*
* @param {object} event `focus` event targeting the select field.
*/
onFocus: _react.PropTypes.func,
/**
* Override the inline-styles of the underlying `DropDownMenu` element.
*/
selectFieldRoot: _react.PropTypes.object, // Must be changed!
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* Override the inline-styles of the underline element when the select
* field is disabled.
*/
underlineDisabledStyle: _react.PropTypes.object,
/**
* Override the inline-styles of the underline element when the select field
* is focused.
*/
underlineFocusStyle: _react.PropTypes.object,
/**
* Override the inline-styles of the underline element.
*/
underlineStyle: _react.PropTypes.object,
/**
* The value that is currently selected.
*/
value: _react.PropTypes.any
};
SelectField.defaultProps = {
autoWidth: false,
disabled: false,
fullWidth: false
};
SelectField.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = SelectField;
/***/ },
/* 149 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _SelectField = __webpack_require__(148);
var _SelectField2 = _interopRequireDefault(_SelectField);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _SelectField2.default;
/***/ },
/* 150 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _keycode = __webpack_require__(10);
var _keycode2 = _interopRequireDefault(_keycode);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _FocusRipple = __webpack_require__(43);
var _FocusRipple2 = _interopRequireDefault(_FocusRipple);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
/**
* Verifies min/max range.
* @param {Object} props Properties of the React component.
* @param {String} propName Name of the property to validate.
* @param {String} componentName Name of the component whose property is being validated.
* @returns {Object} Returns an Error if min >= max otherwise null.
*/
var minMaxPropType = function minMaxPropType(props, propName, componentName) {
var error = _react.PropTypes.number(props, propName, componentName);
if (error !== null) return error;
if (props.min >= props.max) {
var errorMsg = propName === 'min' ? 'min should be less than max' : 'max should be greater than min';
return new Error(errorMsg);
}
};
/**
* Verifies value is within the min/max range.
* @param {Object} props Properties of the React component.
* @param {String} propName Name of the property to validate.
* @param {String} componentName Name of the component whose property is being validated.
* @returns {Object} Returns an Error if the value is not within the range otherwise null.
*/
var valueInRangePropType = function valueInRangePropType(props, propName, componentName) {
var error = _react.PropTypes.number(props, propName, componentName);
if (error !== null) return error;
var value = props[propName];
if (value < props.min || props.max < value) {
return new Error(propName + ' should be within the range specified by min and max');
}
};
var getStyles = function getStyles(props, context, state) {
var slider = context.muiTheme.slider;
var fillGutter = slider.handleSize / 2;
var disabledGutter = slider.trackSize + slider.handleSizeDisabled / 2;
var calcDisabledSpacing = props.disabled ? ' - ' + disabledGutter + 'px' : '';
var styles = {
slider: {
touchCallout: 'none',
userSelect: 'none',
cursor: 'default',
height: slider.handleSizeActive,
position: 'relative',
marginTop: 24,
marginBottom: 48
},
track: {
position: 'absolute',
top: (slider.handleSizeActive - slider.trackSize) / 2,
left: 0,
width: '100%',
height: slider.trackSize
},
filledAndRemaining: {
position: 'absolute',
top: 0,
height: '100%',
transition: _transitions2.default.easeOut(null, 'margin')
},
handle: {
boxSizing: 'border-box',
position: 'absolute',
cursor: 'pointer',
pointerEvents: 'inherit',
top: 0,
left: state.percent === 0 ? '0%' : state.percent * 100 + '%',
zIndex: 1,
margin: slider.trackSize / 2 + 'px 0 0 0',
width: slider.handleSize,
height: slider.handleSize,
backgroundColor: slider.selectionColor,
backgroundClip: 'padding-box',
border: '0px solid transparent',
borderRadius: '50%',
transform: 'translate(-50%, -50%)',
transition: _transitions2.default.easeOut('450ms', 'background') + ', ' + _transitions2.default.easeOut('450ms', 'border-color') + ', ' + _transitions2.default.easeOut('450ms', 'width') + ', ' + _transitions2.default.easeOut('450ms', 'height'),
overflow: 'visible',
outline: 'none'
},
handleWhenDisabled: {
boxSizing: 'content-box',
cursor: 'not-allowed',
backgroundColor: slider.trackColor,
width: slider.handleSizeDisabled,
height: slider.handleSizeDisabled,
border: 'none'
},
handleWhenPercentZero: {
border: slider.trackSize + 'px solid ' + slider.handleColorZero,
backgroundColor: slider.handleFillColor,
boxShadow: 'none'
},
handleWhenPercentZeroAndDisabled: {
cursor: 'not-allowed',
width: slider.handleSizeDisabled,
height: slider.handleSizeDisabled
},
handleWhenPercentZeroAndFocused: {
border: slider.trackSize + 'px solid ' + slider.trackColorSelected
},
handleWhenActive: {
width: slider.handleSizeActive,
height: slider.handleSizeActive
},
ripple: {
height: slider.handleSize,
width: slider.handleSize,
overflow: 'visible'
},
rippleWhenPercentZero: {
top: -slider.trackSize,
left: -slider.trackSize
},
rippleInner: {
height: '300%',
width: '300%',
top: -slider.handleSize,
left: -slider.handleSize
},
rippleColor: {
fill: state.percent === 0 ? slider.handleColorZero : slider.rippleColor
}
};
styles.filled = (0, _simpleAssign2.default)({}, styles.filledAndRemaining, {
left: 0,
backgroundColor: props.disabled ? slider.trackColor : slider.selectionColor,
marginRight: fillGutter,
width: 'calc(' + state.percent * 100 + '%' + calcDisabledSpacing + ')'
});
styles.remaining = (0, _simpleAssign2.default)({}, styles.filledAndRemaining, {
right: 0,
backgroundColor: (state.hovered || state.focused) && !props.disabled ? slider.trackColorSelected : slider.trackColor,
marginLeft: fillGutter,
width: 'calc(' + (1 - state.percent) * 100 + '%' + calcDisabledSpacing + ')'
});
return styles;
};
var Slider = function (_Component) {
_inherits(Slider, _Component);
function Slider() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, Slider);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(Slider)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
active: false,
dragging: false,
focused: false,
hovered: false,
percent: 0,
value: 0
}, _this.onHandleTouchStart = function (event) {
if (document) {
document.addEventListener('touchmove', _this.dragTouchHandler, false);
document.addEventListener('touchup', _this.dragTouchEndHandler, false);
document.addEventListener('touchend', _this.dragTouchEndHandler, false);
document.addEventListener('touchcancel', _this.dragTouchEndHandler, false);
}
_this.onDragStart(event);
// Cancel scroll and context menu
event.preventDefault();
}, _this.onHandleMouseDown = function (event) {
if (document) {
document.addEventListener('mousemove', _this.dragHandler, false);
document.addEventListener('mouseup', _this.dragEndHandler, false);
// Cancel text selection
event.preventDefault();
// Set focus manually since we called preventDefault()
_this.refs.handle.focus();
}
_this.onDragStart(event);
}, _this.onHandleKeyDown = function (event) {
var _this$props = _this.props;
var min = _this$props.min;
var max = _this$props.max;
var step = _this$props.step;
var action = void 0;
switch ((0, _keycode2.default)(event)) {
case 'page down':
case 'left':
case 'down':
action = 'decrease';
break;
case 'page up':
case 'right':
case 'up':
action = 'increase';
break;
case 'home':
action = 'home';
break;
case 'end':
action = 'end';
break;
}
if (action) {
var newValue = void 0;
var newPercent = void 0;
// Cancel scroll
event.preventDefault();
// When pressing home or end the handle should be taken to the
// beginning or end of the track respectively
switch (action) {
case 'decrease':
newValue = Math.max(min, _this.state.value - step);
newPercent = (newValue - min) / (max - min);
break;
case 'increase':
newValue = Math.min(max, _this.state.value + step);
newPercent = (newValue - min) / (max - min);
break;
case 'home':
newValue = min;
newPercent = 0;
break;
case 'end':
newValue = max;
newPercent = 1;
break;
}
// We need to use toFixed() because of float point errors.
// For example, 0.01 + 0.06 = 0.06999999999999999
if (_this.state.value !== newValue) {
_this.setState({
percent: newPercent,
value: parseFloat(newValue.toFixed(5))
}, function () {
if (_this.props.onChange) _this.props.onChange(event, _this.state.value);
});
}
}
}, _this.dragHandler = function (event) {
if (_this.dragRunning) {
return;
}
_this.dragRunning = true;
requestAnimationFrame(function () {
_this.onDragUpdate(event, event.clientX - _this.getTrackLeft());
_this.dragRunning = false;
});
}, _this.dragTouchHandler = function (event) {
if (_this.dragRunning) {
return;
}
_this.dragRunning = true;
requestAnimationFrame(function () {
_this.onDragUpdate(event, event.touches[0].clientX - _this.getTrackLeft());
_this.dragRunning = false;
});
}, _this.dragEndHandler = function (event) {
if (document) {
document.removeEventListener('mousemove', _this.dragHandler, false);
document.removeEventListener('mouseup', _this.dragEndHandler, false);
}
_this.onDragStop(event);
}, _this.dragTouchEndHandler = function (event) {
if (document) {
document.removeEventListener('touchmove', _this.dragTouchHandler, false);
document.removeEventListener('touchup', _this.dragTouchEndHandler, false);
document.removeEventListener('touchend', _this.dragTouchEndHandler, false);
document.removeEventListener('touchcancel', _this.dragTouchEndHandler, false);
}
_this.onDragStop(event);
}, _this.handleTouchStart = function (event) {
if (!_this.props.disabled && !_this.state.dragging) {
var pos = event.touches[0].clientX - _this.getTrackLeft();
_this.dragX(event, pos);
// Since the touch event fired for the track and handle is child of
// track, we need to manually propagate the event to the handle.
_this.onHandleTouchStart(event);
}
}, _this.handleFocus = function (event) {
_this.setState({ focused: true });
if (_this.props.onFocus) _this.props.onFocus(event);
}, _this.handleBlur = function (event) {
_this.setState({ focused: false, active: false });
if (_this.props.onBlur) _this.props.onBlur(event);
}, _this.handleMouseDown = function (event) {
if (!_this.props.disabled && !_this.state.dragging) {
var pos = event.clientX - _this.getTrackLeft();
_this.dragX(event, pos);
// Since the click event fired for the track and handle is child of
// track, we need to manually propagate the event to the handle.
_this.onHandleMouseDown(event);
}
}, _this.handleMouseUp = function () {
if (!_this.props.disabled) _this.setState({ active: false });
}, _this.handleMouseEnter = function () {
_this.setState({ hovered: true });
}, _this.handleMouseLeave = function () {
_this.setState({ hovered: false });
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(Slider, [{
key: 'componentWillMount',
value: function componentWillMount() {
var value = this.props.value;
if (value === undefined) {
value = this.props.defaultValue !== undefined ? this.props.defaultValue : this.props.min;
}
var percent = (value - this.props.min) / (this.props.max - this.props.min);
if (isNaN(percent)) percent = 0;
this.setState({
percent: percent,
value: value
});
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (nextProps.value !== undefined && !this.state.dragging) {
this.setValue(nextProps.value);
}
}
}, {
key: 'getValue',
value: function getValue() {
return this.state.value;
}
}, {
key: 'setValue',
value: function setValue(i) {
// calculate percentage
var percent = (i - this.props.min) / (this.props.max - this.props.min);
if (isNaN(percent)) percent = 0;
// update state
this.setState({
value: i,
percent: percent
});
}
}, {
key: 'getPercent',
value: function getPercent() {
return this.state.percent;
}
}, {
key: 'setPercent',
value: function setPercent(percent, callback) {
var value = this.alignValue(this.percentToValue(percent));
var _props = this.props;
var min = _props.min;
var max = _props.max;
var alignedPercent = (value - min) / (max - min);
if (this.state.value !== value) {
this.setState({ value: value, percent: alignedPercent }, callback);
}
}
}, {
key: 'clearValue',
value: function clearValue() {
this.setValue(this.props.min);
}
}, {
key: 'alignValue',
value: function alignValue(val) {
var _props2 = this.props;
var step = _props2.step;
var min = _props2.min;
var alignValue = Math.round((val - min) / step) * step + min;
return parseFloat(alignValue.toFixed(5));
}
}, {
key: 'getTrackLeft',
value: function getTrackLeft() {
return this.refs.track.getBoundingClientRect().left;
}
}, {
key: 'onDragStart',
value: function onDragStart(event) {
this.setState({
dragging: true,
active: true
});
if (this.props.onDragStart) this.props.onDragStart(event);
}
}, {
key: 'onDragStop',
value: function onDragStop(event) {
this.setState({
dragging: false,
active: false
});
if (this.props.onDragStop) this.props.onDragStop(event);
}
}, {
key: 'onDragUpdate',
value: function onDragUpdate(event, pos) {
if (!this.state.dragging) return;
if (!this.props.disabled) this.dragX(event, pos);
}
}, {
key: 'dragX',
value: function dragX(event, pos) {
var max = this.refs.track.clientWidth;
if (pos < 0) pos = 0;else if (pos > max) pos = max;
this.updateWithChangeEvent(event, pos / max);
}
}, {
key: 'updateWithChangeEvent',
value: function updateWithChangeEvent(event, percent) {
var _this2 = this;
this.setPercent(percent, function () {
if (_this2.props.onChange) _this2.props.onChange(event, _this2.state.value);
});
}
}, {
key: 'percentToValue',
value: function percentToValue(percent) {
return percent * (this.props.max - this.props.min) + this.props.min;
}
}, {
key: 'render',
value: function render() {
var _props3 = this.props;
var description = _props3.description;
var disabled = _props3.disabled;
var disableFocusRipple = _props3.disableFocusRipple;
var error = _props3.error;
var max = _props3.max;
var min = _props3.min;
var name = _props3.name;
var required = _props3.required;
var step = _props3.step;
var style = _props3.style;
var others = _objectWithoutProperties(_props3, ['description', 'disabled', 'disableFocusRipple', 'error', 'max', 'min', 'name', 'required', 'step', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context, this.state);
var sliderStyles = styles.slider;
var handleStyles = {};
var percent = this.state.percent;
if (percent > 1) percent = 1;else if (percent < 0) percent = 0;
if (percent === 0) {
handleStyles = (0, _simpleAssign2.default)({}, styles.handle, styles.handleWhenPercentZero, this.state.active && styles.handleWhenActive, (this.state.hovered || this.state.focused) && !disabled && styles.handleWhenPercentZeroAndFocused, disabled && styles.handleWhenPercentZeroAndDisabled);
} else {
handleStyles = (0, _simpleAssign2.default)({}, styles.handle, this.state.active && styles.handleWhenActive, disabled && styles.handleWhenDisabled);
}
var rippleStyle = (0, _simpleAssign2.default)({}, styles.ripple, percent === 0 && styles.rippleWhenPercentZero);
var rippleShowCondition = (this.state.hovered || this.state.focused) && !this.state.active;
var focusRipple = void 0;
if (!disabled && !disableFocusRipple) {
focusRipple = _react2.default.createElement(_FocusRipple2.default, {
ref: 'focusRipple',
key: 'focusRipple',
style: rippleStyle,
innerStyle: styles.rippleInner,
show: rippleShowCondition,
muiTheme: this.context.muiTheme,
color: styles.rippleColor.fill
});
}
var handleDragProps = void 0;
if (!disabled) {
handleDragProps = {
onTouchStart: this.onHandleTouchStart,
onMouseDown: this.onHandleMouseDown,
onKeyDown: this.onHandleKeyDown
};
}
return _react2.default.createElement(
'div',
_extends({}, others, { style: prepareStyles((0, _simpleAssign2.default)({}, style)) }),
_react2.default.createElement(
'span',
null,
description
),
_react2.default.createElement(
'span',
null,
error
),
_react2.default.createElement(
'div',
{
style: prepareStyles(sliderStyles),
onFocus: this.handleFocus,
onBlur: this.handleBlur,
onMouseDown: this.handleMouseDown,
onMouseEnter: this.handleMouseEnter,
onMouseLeave: this.handleMouseLeave,
onMouseUp: this.handleMouseUp,
onTouchStart: this.handleTouchStart
},
_react2.default.createElement(
'div',
{ ref: 'track', style: prepareStyles(styles.track) },
_react2.default.createElement('div', { style: prepareStyles(styles.filled) }),
_react2.default.createElement('div', { style: prepareStyles(styles.remaining) }),
_react2.default.createElement(
'div',
_extends({
ref: 'handle',
style: prepareStyles(handleStyles),
tabIndex: 0
}, handleDragProps),
focusRipple
)
)
),
_react2.default.createElement('input', {
ref: 'input',
type: 'hidden',
name: name,
value: this.state.value,
required: required,
min: min,
max: max,
step: step
})
);
}
}]);
return Slider;
}(_react.Component);
Slider.propTypes = {
/**
* The default value of the slider.
*/
defaultValue: valueInRangePropType,
/**
* Describe the slider.
*/
description: _react.PropTypes.string,
/**
* Disables focus ripple if set to true.
*/
disableFocusRipple: _react.PropTypes.bool,
/**
* If true, the slider will not be interactable.
*/
disabled: _react.PropTypes.bool,
/**
* An error message for the slider.
*/
error: _react.PropTypes.string,
/**
* The maximum value the slider can slide to on
* a scale from 0 to 1 inclusive. Cannot be equal to min.
*/
max: minMaxPropType,
/**
* The minimum value the slider can slide to on a scale
* from 0 to 1 inclusive. Cannot be equal to max.
*/
min: minMaxPropType,
/**
* The name of the slider. Behaves like the name attribute
* of an input element.
*/
name: _react.PropTypes.string,
/**
* Callback function that is fired when the focus has left the slider.
*/
onBlur: _react.PropTypes.func,
/**
* Callback function that is fired when the user changes the slider's value.
*/
onChange: _react.PropTypes.func,
/**
* Callback function that is fired when the slider has begun to move.
*/
onDragStart: _react.PropTypes.func,
/**
* Callback function that is fried when the slide has stopped moving.
*/
onDragStop: _react.PropTypes.func,
/**
* Callback fired when the user has focused on the slider.
*/
onFocus: _react.PropTypes.func,
/**
* Whether or not the slider is required in a form.
*/
required: _react.PropTypes.bool,
/**
* The granularity the slider can step through values.
*/
step: _react.PropTypes.number,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* The value of the slider.
*/
value: valueInRangePropType
};
Slider.defaultProps = {
disabled: false,
disableFocusRipple: false,
max: 1,
min: 0,
required: true,
step: 0.01,
style: {}
};
Slider.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = Slider;
/***/ },
/* 151 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _Slider = __webpack_require__(150);
var _Slider2 = _interopRequireDefault(_Slider);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _Slider2.default;
/***/ },
/* 152 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _ClickAwayListener = __webpack_require__(41);
var _ClickAwayListener2 = _interopRequireDefault(_ClickAwayListener);
var _SnackbarBody = __webpack_require__(153);
var _SnackbarBody2 = _interopRequireDefault(_SnackbarBody);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context, state) {
var _context$muiTheme = context.muiTheme;
var desktopSubheaderHeight = _context$muiTheme.baseTheme.spacing.desktopSubheaderHeight;
var zIndex = _context$muiTheme.zIndex;
var open = state.open;
var styles = {
root: {
position: 'fixed',
left: 0,
display: 'flex',
right: 0,
bottom: 0,
zIndex: zIndex.snackbar,
visibility: open ? 'visible' : 'hidden',
transform: open ? 'translate3d(0, 0, 0)' : 'translate3d(0, ' + desktopSubheaderHeight + 'px, 0)',
transition: _transitions2.default.easeOut('400ms', 'transform') + ', ' + _transitions2.default.easeOut('400ms', 'visibility')
}
};
return styles;
}
var Snackbar = function (_Component) {
_inherits(Snackbar, _Component);
function Snackbar() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, Snackbar);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(Snackbar)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.componentClickAway = function () {
if (_this.timerTransitionId) {
// If transitioning, don't close the snackbar.
return;
}
if (_this.props.open !== null && _this.props.onRequestClose) {
_this.props.onRequestClose('clickaway');
} else {
_this.setState({ open: false });
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(Snackbar, [{
key: 'componentWillMount',
value: function componentWillMount() {
this.setState({
open: this.props.open,
message: this.props.message,
action: this.props.action
});
}
}, {
key: 'componentDidMount',
value: function componentDidMount() {
if (this.state.open) {
this.setAutoHideTimer();
this.setTransitionTimer();
}
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
var _this2 = this;
if (this.state.open && nextProps.open === this.props.open && (nextProps.message !== this.props.message || nextProps.action !== this.props.action)) {
this.setState({
open: false
});
clearTimeout(this.timerOneAtTheTimeId);
this.timerOneAtTheTimeId = setTimeout(function () {
_this2.setState({
message: nextProps.message,
action: nextProps.action,
open: true
});
}, 400);
} else {
var open = nextProps.open;
this.setState({
open: open !== null ? open : this.state.open,
message: nextProps.message,
action: nextProps.action
});
}
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate(prevProps, prevState) {
if (prevState.open !== this.state.open) {
if (this.state.open) {
this.setAutoHideTimer();
this.setTransitionTimer();
} else {
clearTimeout(this.timerAutoHideId);
}
}
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
clearTimeout(this.timerAutoHideId);
clearTimeout(this.timerTransitionId);
clearTimeout(this.timerOneAtTheTimeId);
}
}, {
key: 'setAutoHideTimer',
// Timer that controls delay before snackbar auto hides
value: function setAutoHideTimer() {
var _this3 = this;
var autoHideDuration = this.props.autoHideDuration;
if (autoHideDuration > 0) {
clearTimeout(this.timerAutoHideId);
this.timerAutoHideId = setTimeout(function () {
if (_this3.props.open !== null && _this3.props.onRequestClose) {
_this3.props.onRequestClose('timeout');
} else {
_this3.setState({ open: false });
}
}, autoHideDuration);
}
}
// Timer that controls delay before click-away events are captured (based on when animation completes)
}, {
key: 'setTransitionTimer',
value: function setTransitionTimer() {
var _this4 = this;
this.timerTransitionId = setTimeout(function () {
_this4.timerTransitionId = undefined;
}, 400);
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var onActionTouchTap = _props.onActionTouchTap;
var style = _props.style;
var bodyStyle = _props.bodyStyle;
var others = _objectWithoutProperties(_props, ['onActionTouchTap', 'style', 'bodyStyle']);
var _state = this.state;
var action = _state.action;
var message = _state.message;
var open = _state.open;
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context, this.state);
return _react2.default.createElement(
_ClickAwayListener2.default,
{ onClickAway: open && this.componentClickAway },
_react2.default.createElement(
'div',
_extends({}, others, { style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) }),
_react2.default.createElement(_SnackbarBody2.default, {
open: open,
message: message,
action: action,
style: bodyStyle,
onActionTouchTap: onActionTouchTap
})
)
);
}
}]);
return Snackbar;
}(_react.Component);
Snackbar.propTypes = {
/**
* The label for the action on the snackbar.
*/
action: _react.PropTypes.string,
/**
* The number of milliseconds to wait before automatically dismissing.
* If no value is specified the snackbar will dismiss normally.
* If a value is provided the snackbar can still be dismissed normally.
* If a snackbar is dismissed before the timer expires, the timer will be cleared.
*/
autoHideDuration: _react.PropTypes.number,
/**
* Override the inline-styles of the body element.
*/
bodyStyle: _react.PropTypes.object,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* The message to be displayed.
*
* (Note: If the message is an element or array, and the `Snackbar` may re-render while it is still open,
* ensure that the same object remains as the `message` property if you want to avoid the `Snackbar` hiding and
* showing again)
*/
message: _react.PropTypes.node.isRequired,
/**
* Fired when the action button is touchtapped.
*
* @param {object} event Action button event.
*/
onActionTouchTap: _react.PropTypes.func,
/**
* Fired when the `Snackbar` is requested to be closed by a click outside the `Snackbar`, or after the
* `autoHideDuration` timer expires.
*
* Typically `onRequestClose` is used to set state in the parent component, which is used to control the `Snackbar`
* `open` prop.
*
* The `reason` parameter can optionally be used to control the response to `onRequestClose`,
* for example ignoring `clickaway`.
*
* @param {string} reason Can be:`"timeout"` (`autoHideDuration` expired) or: `"clickaway"`
*/
onRequestClose: _react.PropTypes.func,
/**
* Controls whether the `Snackbar` is opened or not.
*/
open: _react.PropTypes.bool.isRequired,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
Snackbar.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = Snackbar;
/***/ },
/* 153 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.SnackbarBody = undefined;
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _withWidth = __webpack_require__(214);
var _withWidth2 = _interopRequireDefault(_withWidth);
var _FlatButton = __webpack_require__(27);
var _FlatButton2 = _interopRequireDefault(_FlatButton);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function getStyles(props, context) {
var open = props.open;
var width = props.width;
var _context$muiTheme = context.muiTheme;
var _context$muiTheme$bas = _context$muiTheme.baseTheme.spacing;
var desktopGutter = _context$muiTheme$bas.desktopGutter;
var desktopSubheaderHeight = _context$muiTheme$bas.desktopSubheaderHeight;
var _context$muiTheme$sna = _context$muiTheme.snackbar;
var backgroundColor = _context$muiTheme$sna.backgroundColor;
var textColor = _context$muiTheme$sna.textColor;
var actionColor = _context$muiTheme$sna.actionColor;
var isSmall = width === _withWidth.SMALL;
var styles = {
root: {
backgroundColor: backgroundColor,
padding: '0 ' + desktopGutter + 'px',
height: desktopSubheaderHeight,
lineHeight: desktopSubheaderHeight + 'px',
borderRadius: isSmall ? 0 : 2,
maxWidth: isSmall ? 'inherit' : 568,
minWidth: isSmall ? 'inherit' : 288,
flexGrow: isSmall ? 1 : 0,
margin: 'auto'
},
content: {
fontSize: 14,
color: textColor,
opacity: open ? 1 : 0,
transition: open ? _transitions2.default.easeOut('500ms', 'opacity', '100ms') : _transitions2.default.easeOut('400ms', 'opacity')
},
action: {
color: actionColor,
float: 'right',
marginTop: 6,
marginRight: -16,
marginLeft: desktopGutter,
backgroundColor: 'transparent'
}
};
return styles;
}
var SnackbarBody = exports.SnackbarBody = function SnackbarBody(props, context) {
var open = props.open;
var // eslint-disable-line no-unused-vars
action = props.action;
var message = props.message;
var onActionTouchTap = props.onActionTouchTap;
var style = props.style;
var other = _objectWithoutProperties(props, ['open', 'action', 'message', 'onActionTouchTap', 'style']);
var prepareStyles = context.muiTheme.prepareStyles;
var styles = getStyles(props, context);
var actionButton = action && _react2.default.createElement(_FlatButton2.default, {
style: styles.action,
label: action,
onTouchTap: onActionTouchTap
});
return _react2.default.createElement(
'div',
_extends({}, other, { style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) }),
_react2.default.createElement(
'div',
{ style: prepareStyles(styles.content) },
_react2.default.createElement(
'span',
null,
message
),
actionButton
)
);
};
SnackbarBody.propTypes = {
/**
* The label for the action on the snackbar.
*/
action: _react.PropTypes.string,
/**
* The message to be displayed.
*
* (Note: If the message is an element or array, and the `Snackbar` may re-render while it is still open,
* ensure that the same object remains as the `message` property if you want to avoid the `Snackbar` hiding and
* showing again)
*/
message: _react.PropTypes.node.isRequired,
/**
* Fired when the action button is touchtapped.
*
* @param {object} event Action button event.
*/
onActionTouchTap: _react.PropTypes.func,
/**
* @ignore
* Controls whether the `Snackbar` is opened or not.
*/
open: _react.PropTypes.bool.isRequired,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* @ignore
* Width of the screen.
*/
width: _react.PropTypes.number.isRequired
};
SnackbarBody.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = (0, _withWidth2.default)()(SnackbarBody);
/***/ },
/* 154 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = undefined;
var _Snackbar = __webpack_require__(152);
var _Snackbar2 = _interopRequireDefault(_Snackbar);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.default = _Snackbar2.default;
/***/ },
/* 155 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var getStyles = function getStyles(_ref, _ref2) {
var index = _ref.index;
var stepper = _ref2.stepper;
var orientation = stepper.orientation;
var styles = {
root: {
flex: '0 0 auto'
}
};
if (index > 0) {
if (orientation === 'horizontal') {
styles.root.marginLeft = -6;
} else if (orientation === 'vertical') {
styles.root.marginTop = -14;
}
}
return styles;
};
var Step = function (_Component) {
_inherits(Step, _Component);
function Step() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, Step);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(Step)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.renderChild = function (child) {
var _this$props = _this.props;
var active = _this$props.active;
var completed = _this$props.completed;
var disabled = _this$props.disabled;
var index = _this$props.index;
var last = _this$props.last;
var icon = index + 1;
return _react2.default.cloneElement(child, (0, _simpleAssign2.default)({ active: active, completed: completed, disabled: disabled, icon: icon, last: last }, child.props));
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(Step, [{
key: 'render',
value: function render() {
var _props = this.props;
var children = _props.children;
var style = _props.style;
var other = _objectWithoutProperties(_props, ['children', 'style']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
return _react2.default.createElement(
'div',
_extends({ style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) }, other),
_react2.default.Children.map(children, this.renderChild)
);
}
}]);
return Step;
}(_react.Component);
Step.propTypes = {
/**
* Sets the step as active. Is passed to child components.
*/
active: _react.PropTypes.bool,
/**
* Should be `Step` sub-components such as `StepLabel`.
*/
children: _react.PropTypes.node,
/**
* Mark the step as completed. Is passed to child components.
*/
completed: _react.PropTypes.bool,
/**
* Mark the step as disabled, will also disable the button if
* `StepButton` is a child of `Step`. Is passed to child components.
*/
disabled: _react.PropTypes.bool,
/**
* @ignore
* Used internally for numbering.
*/
index: _react.PropTypes.number,
/**
* @ignore
*/
last: _react.PropTypes.bool,
/**
* Override the inline-style of the root element.
*/
style: _react.PropTypes.object
};
Step.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired,
stepper: _react.PropTypes.object
};
exports.default = Step;
/***/ },
/* 156 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
var _EnhancedButton = __webpack_require__(11);
var _EnhancedButton2 = _interopRequireDefault(_EnhancedButton);
var _StepLabel = __webpack_require__(67);
var _StepLabel2 = _interopRequireDefault(_StepLabel);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var isLabel = function isLabel(child) {
return child && child.type && child.type.muiName === 'StepLabel';
};
var getStyles = function getStyles(props, context, state) {
var hovered = state.hovered;
var _context$muiTheme$ste = context.muiTheme.stepper;
var backgroundColor = _context$muiTheme$ste.backgroundColor;
var hoverBackgroundColor = _context$muiTheme$ste.hoverBackgroundColor;
var styles = {
root: {
padding: 0,
backgroundColor: hovered ? hoverBackgroundColor : backgroundColor,
transition: _transitions2.default.easeOut()
}
};
if (context.stepper.orientation === 'vertical') {
styles.root.width = '100%';
}
return styles;
};
var StepButton = function (_Component) {
_inherits(StepButton, _Component);
function StepButton() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, StepButton);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(StepButton)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
hovered: false,
touched: false
}, _this.handleMouseEnter = function (event) {
var onMouseEnter = _this.props.onMouseEnter;
// Cancel hover styles for touch devices
if (!_this.state.touched) {
_this.setState({ hovered: true });
}
if (typeof onMouseEnter === 'function') {
onMouseEnter(event);
}
}, _this.handleMouseLeave = function (event) {
var onMouseLeave = _this.props.onMouseLeave;
_this.setState({ hovered: false });
if (typeof onMouseLeave === 'function') {
onMouseLeave(event);
}
}, _this.handleTouchStart = function (event) {
var onTouchStart = _this.props.onTouchStart;
if (!_this.state.touched) {
_this.setState({ touched: true });
}
if (typeof onTouchStart === 'function') {
onTouchStart(event);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(StepButton, [{
key: 'render',
value: function render() {
var _props = this.props;
var active = _props.active;
var children = _props.children;
var completed = _props.completed;
var disabled = _props.disabled;
var icon = _props.icon;
var onMouseEnter = _props.onMouseEnter;
var // eslint-disable-line no-unused-vars
onMouseLeave = _props.onMouseLeave;
var // eslint-disable-line no-unused-vars
onTouchStart = _props.onTouchStart;
var // eslint-disable-line no-unused-vars
style = _props.style;
var other = _objectWithoutProperties(_props, ['active', 'children', 'completed', 'disabled', 'icon', 'onMouseEnter', 'onMouseLeave', 'onTouchStart', 'style']);
var styles = getStyles(this.props, this.context, this.state);
var child = isLabel(children) ? children : _react2.default.createElement(
_StepLabel2.default,
null,
children
);
return _react2.default.createElement(
_EnhancedButton2.default,
_extends({
disabled: disabled,
style: (0, _simpleAssign2.default)(styles.root, style),
onMouseEnter: this.handleMouseEnter,
onMouseLeave: this.handleMouseLeave,
onTouchStart: this.handleTouchStart
}, other),
_react2.default.cloneElement(child, { active: active, completed: completed, disabled: disabled, icon: icon })
);
}
}]);
return StepButton;
}(_react.Component);
StepButton.propTypes = {
/**
* Passed from `Step` Is passed to StepLabel.
*/
active: _react.PropTypes.bool,
/**
* Can be a `StepLabel` or a node to place inside `StepLabel` as children.
*/
children: _react.PropTypes.node,
/**
* Sets completed styling. Is passed to StepLabel.
*/
completed: _react.PropTypes.bool,
/**
* Disables the button and sets disabled styling. Is passed to StepLabel.
*/
disabled: _react.PropTypes.bool,
/**
* The icon displayed by the step label.
*/
icon: _react.PropTypes.oneOfType([_react.PropTypes.element, _react.PropTypes.string, _react.PropTypes.number]),
/**
* Callback function fired when the mouse enters the element.
*
* @param {object} event `mouseenter` event targeting the element.
*/
onMouseEnter: _react.PropTypes.func,
/**
* Callback function fired when the mouse leaves the element.
*
* @param {object} event `mouseleave` event targeting the element.
*/
onMouseLeave: _react.PropTypes.func,
/**
* Callback function fired when the element is touched.
*
* @param {object} event `touchstart` event targeting the element.
*/
onTouchStart: _react.PropTypes.func,
/**
* Override the inline-style of the root element.
*/
style: _react.PropTypes.object
};
StepButton.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired,
stepper: _react.PropTypes.object
};
exports.default = StepButton;
/***/ },
/* 157 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.PlainStepConnector = undefined;
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _pure = __webpack_require__(7);
var _pure2 = _interopRequireDefault(_pure);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var propTypes = {
/**
* Override the inline-style of the root element.
*/
style: _react.PropTypes.object
};
var contextTypes = {
muiTheme: _react.PropTypes.object.isRequired,
stepper: _react.PropTypes.object
};
var StepConnector = function StepConnector(props, context) {
var muiTheme = context.muiTheme;
var stepper = context.stepper;
var styles = {
wrapper: {
flex: '1 1 auto'
},
line: {
display: 'block',
borderColor: muiTheme.stepper.connectorLineColor
}
};
/**
* Clean up once we can use CSS pseudo elements
*/
if (stepper.orientation === 'horizontal') {
styles.line.marginLeft = -6;
styles.line.borderTopStyle = 'solid';
styles.line.borderTopWidth = 1;
} else if (stepper.orientation === 'vertical') {
styles.wrapper.marginLeft = 14 + 11; // padding + 1/2 icon
styles.line.borderLeftStyle = 'solid';
styles.line.borderLeftWidth = 1;
styles.line.minHeight = 28;
}
var prepareStyles = muiTheme.prepareStyles;
return _react2.default.createElement(
'div',
{ style: prepareStyles(styles.wrapper) },
_react2.default.createElement('span', { style: prepareStyles(styles.line) })
);
};
StepConnector.propTypes = propTypes;
StepConnector.contextTypes = contextTypes;
exports.PlainStepConnector = StepConnector;
exports.default = (0, _pure2.default)(StepConnector);
/***/ },
/* 158 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _ExpandTransition = __webpack_require__(188);
var _ExpandTransition2 = _interopRequireDefault(_ExpandTransition);
var _warning = __webpack_require__(6);
var _warning2 = _interopRequireDefault(_warning);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function ExpandTransition(props) {
return _react2.default.createElement(_ExpandTransition2.default, props);
}
var getStyles = function getStyles(props, context) {
var styles = {
root: {
marginTop: -14,
marginLeft: 14 + 11, // padding + 1/2 icon
paddingLeft: 24 - 11 + 8,
paddingRight: 16,
overflow: 'hidden'
}
};
if (!props.last) {
styles.root.borderLeft = '1px solid ' + context.muiTheme.stepper.connectorLineColor;
}
return styles;
};
var StepContent = function (_Component) {
_inherits(StepContent, _Component);
function StepContent() {
_classCallCheck(this, StepContent);
return _possibleConstructorReturn(this, Object.getPrototypeOf(StepContent).apply(this, arguments));
}
_createClass(StepContent, [{
key: 'render',
value: function render() {
var _props = this.props;
var active = _props.active;
var children = _props.children;
var last = _props.last;
var // eslint-disable-line no-unused-vars
style = _props.style;
var transition = _props.transition;
var transitionDuration = _props.transitionDuration;
var other = _objectWithoutProperties(_props, ['active', 'children', 'last', 'style', 'transition', 'transitionDuration']);
var _context = this.context;
var stepper = _context.stepper;
var prepareStyles = _context.muiTheme.prepareStyles;
if (stepper.orientation !== 'vertical') {
true ? (0, _warning2.default)(false, '<StepContent /> is only designed for use with the vertical stepper.') : void 0;
return null;
}
var styles = getStyles(this.props, this.context);
var transitionProps = {
enterDelay: transitionDuration,
transitionDuration: transitionDuration,
open: active
};
return _react2.default.createElement(
'div',
_extends({ style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) }, other),
_react2.default.createElement(transition, transitionProps, _react2.default.createElement(
'div',
{ style: { overflow: 'hidden' } },
children
))
);
}
}]);
return StepContent;
}(_react.Component);
StepContent.propTypes = {
/**
* Expands the content
*/
active: _react.PropTypes.bool,
/**
* Step content
*/
children: _react.PropTypes.node,
/**
* @ignore
*/
last: _react.PropTypes.bool,
/**
* Override the inline-style of the root element.
*/
style: _react.PropTypes.object,
/**
* ReactTransitionGroup component.
*/
transition: _react.PropTypes.func,
/**
* Adjust the duration of the content expand transition. Passed as a prop to the transition component.
*/
transitionDuration: _react.PropTypes.number
};
StepContent.defaultProps = {
transition: ExpandTransition,
transitionDuration: 450
};
StepContent.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired,
stepper: _react.PropTypes.object
};
exports.default = StepContent;
/***/ },
/* 159 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _StepConnector = __webpack_require__(157);
var _StepConnector2 = _interopRequireDefault(_StepConnector);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var getStyles = function getStyles(props) {
var orientation = props.orientation;
return {
root: {
display: 'flex',
flexDirection: orientation === 'horizontal' ? 'row' : 'column',
alignContent: 'center',
alignItems: orientation === 'horizontal' ? 'center' : 'stretch',
justifyContent: 'space-between'
}
};
};
var Stepper = function (_Component) {
_inherits(Stepper, _Component);
function Stepper() {
_classCallCheck(this, Stepper);
return _possibleConstructorReturn(this, Object.getPrototypeOf(Stepper).apply(this, arguments));
}
_createClass(Stepper, [{
key: 'getChildContext',
value: function getChildContext() {
var orientation = this.props.orientation;
return { stepper: { orientation: orientation } };
}
}, {
key: 'render',
value: function render() {
var _props = this.props;
var activeStep = _props.activeStep;
var children = _props.children;
var linear = _props.linear;
var style = _props.style;
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
/**
* One day, we may be able to use real CSS tools
* For now, we need to create our own "pseudo" elements
* and nth child selectors, etc
* That's what some of this garbage is for :)
*/
var steps = _react2.default.Children.map(children, function (step, index) {
var controlProps = { index: index };
if (activeStep === index) {
controlProps.active = true;
} else if (linear && activeStep > index) {
controlProps.completed = true;
} else if (linear && activeStep < index) {
controlProps.disabled = true;
}
if (index + 1 === children.length) {
controlProps.last = true;
}
return [index > 0 && _react2.default.createElement(_StepConnector2.default, null), _react2.default.cloneElement(step, (0, _simpleAssign2.default)(controlProps, step.props))];
});
return _react2.default.createElement(
'div',
{ style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) },
steps
);
}
}]);
return Stepper;
}(_react.Component);
Stepper.propTypes = {
/**
* Set the active step (zero based index). This will enable `Step` control helpers.
*/
activeStep: _react.PropTypes.number,
/**
* Should be two or more `<Step />` components
*/
children: _react.PropTypes.arrayOf(_react.PropTypes.element),
/**
* If set to `true`, the `Stepper` will assist in controlling steps for linear flow
*/
linear: _react.PropTypes.bool,
/**
* The stepper orientation (layout flow direction)
*/
orientation: _react.PropTypes.oneOf(['horizontal', 'vertical']),
/**
* Override the inline-style of the root element.
*/
style: _react.PropTypes.object
};
Stepper.defaultProps = {
orientation: 'horizontal',
linear: true
};
Stepper.contextTypes = { muiTheme: _react.PropTypes.object.isRequired };
Stepper.childContextTypes = { stepper: _react.PropTypes.object };
exports.default = Stepper;
/***/ },
/* 160 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
var propTypes = {
/**
* Node that will be placed inside the `Subheader`.
*/
children: _react.PropTypes.node,
/**
* If true, the `Subheader` will be indented by `72px`.
*/
inset: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object
};
var defaultProps = {
inset: false
};
var contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
var Subheader = function Subheader(props, context) {
var children = props.children;
var inset = props.inset;
var style = props.style;
var other = _objectWithoutProperties(props, ['children', 'inset', 'style']);
var _context$muiTheme = context.muiTheme;
var prepareStyles = _context$muiTheme.prepareStyles;
var subheader = _context$muiTheme.subheader;
var styles = {
root: {
boxSizing: 'border-box',
color: subheader.color,
fontSize: 14,
fontWeight: subheader.fontWeight,
lineHeight: '48px',
paddingLeft: inset ? 72 : 16,
width: '100%'
}
};
return _react2.default.createElement(
'div',
_extends({}, other, { style: prepareStyles((0, _simpleAssign2.default)({}, styles.root, style)) }),
children
);
};
Subheader.muiName = 'Subheader';
Subheader.propTypes = propTypes;
Subheader.defaultProps = defaultProps;
Subheader.contextTypes = contextTypes;
exports.default = Subheader;
/***/ },
/* 161 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var SvgIcon = function (_Component) {
_inherits(SvgIcon, _Component);
function SvgIcon() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, SvgIcon);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(SvgIcon)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
hovered: false
}, _this.handleMouseLeave = function (event) {
_this.setState({ hovered: false });
_this.props.onMouseLeave(event);
}, _this.handleMouseEnter = function (event) {
_this.setState({ hovered: true });
_this.props.onMouseEnter(event);
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(SvgIcon, [{
key: 'render',
value: function render() {
var _props = this.props;
var children = _props.children;
var color = _props.color;
var hoverColor = _props.hoverColor;
var onMouseEnter = _props.onMouseEnter;
var // eslint-disable-line no-unused-vars
onMouseLeave = _props.onMouseLeave;
var // eslint-disable-line no-unused-vars
style = _props.style;
var viewBox = _props.viewBox;
var other = _objectWithoutProperties(_props, ['children', 'color', 'hoverColor', 'onMouseEnter', 'onMouseLeave', 'style', 'viewBox']);
var _context$muiTheme = this.context.muiTheme;
var baseTheme = _context$muiTheme.baseTheme;
var prepareStyles = _context$muiTheme.prepareStyles;
var offColor = color ? color : style && style.fill ? style.fill : baseTheme.palette.textColor;
var onColor = hoverColor ? hoverColor : offColor;
var mergedStyles = (0, _simpleAssign2.default)({
display: 'inline-block',
fill: this.state.hovered ? onColor : offColor,
height: 24,
width: 24,
userSelect: 'none',
transition: _transitions2.default.easeOut()
}, style);
return _react2.default.createElement(
'svg',
_extends({}, other, {
onMouseEnter: this.handleMouseEnter,
onMouseLeave: this.handleMouseLeave,
style: prepareStyles(mergedStyles),
viewBox: viewBox
}),
children
);
}
}]);
return SvgIcon;
}(_react.Component);
SvgIcon.muiName = 'SvgIcon';
SvgIcon.propTypes = {
/**
* Elements passed into the SVG Icon.
*/
children: _react.PropTypes.node,
/**
* This is the fill color of the svg icon.
* If not specified, this component will default
* to muiTheme.palette.textColor.
*/
color: _react.PropTypes.string,
/**
* This is the icon color when the mouse hovers over the icon.
*/
hoverColor: _react.PropTypes.string,
/**
* Function called when mouse enters this element.
*/
onMouseEnter: _react.PropTypes.func,
/**
* Function called when mouse leaves this element.
*/
onMouseLeave: _react.PropTypes.func,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* Allows you to redifine what the coordinates
* without units mean inside an svg element. For example,
* if the SVG element is 500 (width) by 200 (height), and you
* pass viewBox="0 0 50 20", this means that the coordinates inside
* the svg will go from the top left corner (0,0) to bottom right (50,20)
* and each unit will be worth 10px.
*/
viewBox: _react.PropTypes.string
};
SvgIcon.defaultProps = {
onMouseEnter: function onMouseEnter() {},
onMouseLeave: function onMouseLeave() {},
viewBox: '0 0 24 24'
};
SvgIcon.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = SvgIcon;
/***/ },
/* 162 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var _context$muiTheme = context.muiTheme;
var baseTheme = _context$muiTheme.baseTheme;
var table = _context$muiTheme.table;
return {
root: {
backgroundColor: table.backgroundColor,
padding: '0 ' + baseTheme.spacing.desktopGutter + 'px',
width: '100%',
borderCollapse: 'collapse',
borderSpacing: 0,
tableLayout: 'fixed',
fontFamily: baseTheme.fontFamily
},
bodyTable: {
height: props.fixedHeader || props.fixedFooter ? props.height : 'auto',
overflowX: 'hidden',
overflowY: 'auto'
},
tableWrapper: {
height: props.fixedHeader || props.fixedFooter ? 'auto' : props.height,
overflow: 'auto'
}
};
}
var Table = function (_Component) {
_inherits(Table, _Component);
function Table() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, Table);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(Table)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = {
allRowsSelected: _this.props.allRowsSelected
}, _this.onCellClick = function (rowNumber, columnNumber, event) {
if (_this.props.onCellClick) _this.props.onCellClick(rowNumber, columnNumber, event);
}, _this.onCellHover = function (rowNumber, columnNumber, event) {
if (_this.props.onCellHover) _this.props.onCellHover(rowNumber, columnNumber, event);
}, _this.onCellHoverExit = function (rowNumber, columnNumber, event) {
if (_this.props.onCellHoverExit) _this.props.onCellHoverExit(rowNumber, columnNumber, event);
}, _this.onRowHover = function (rowNumber) {
if (_this.props.onRowHover) _this.props.onRowHover(rowNumber);
}, _this.onRowHoverExit = function (rowNumber) {
if (_this.props.onRowHoverExit) _this.props.onRowHoverExit(rowNumber);
}, _this.onRowSelection = function (selectedRows) {
if (_this.state.allRowsSelected) _this.setState({ allRowsSelected: false });
if (_this.props.onRowSelection) _this.props.onRowSelection(selectedRows);
}, _this.onSelectAll = function () {
if (_this.props.onRowSelection) {
if (!_this.state.allRowsSelected) {
_this.props.onRowSelection('all');
} else {
_this.props.onRowSelection('none');
}
}
_this.setState({ allRowsSelected: !_this.state.allRowsSelected });
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(Table, [{
key: 'isScrollbarVisible',
value: function isScrollbarVisible() {
var tableDivHeight = this.refs.tableDiv.clientHeight;
var tableBodyHeight = this.refs.tableBody.clientHeight;
return tableBodyHeight > tableDivHeight;
}
}, {
key: 'createTableHeader',
value: function createTableHeader(base) {
return _react2.default.cloneElement(base, {
enableSelectAll: base.props.enableSelectAll && this.props.selectable && this.props.multiSelectable,
onSelectAll: this.onSelectAll,
selectAllSelected: this.state.allRowsSelected
});
}
}, {
key: 'createTableBody',
value: function createTableBody(base) {
return _react2.default.cloneElement(base, {
allRowsSelected: this.state.allRowsSelected,
multiSelectable: this.props.multiSelectable,
onCellClick: this.onCellClick,
onCellHover: this.onCellHover,
onCellHoverExit: this.onCellHoverExit,
onRowHover: this.onRowHover,
onRowHoverExit: this.onRowHoverExit,
onRowSelection: this.onRowSelection,
selectable: this.props.selectable,
style: (0, _simpleAssign2.default)({ height: this.props.height }, base.props.style)
});
}
}, {
key: 'createTableFooter',
value: function createTableFooter(base) {
return base;
}
}, {
key: 'render',
value: function render() {
var _this2 = this;
var _props = this.props;
var children = _props.children;
var className = _props.className;
var fixedFooter = _props.fixedFooter;
var fixedHeader = _props.fixedHeader;
var style = _props.style;
var wrapperStyle = _props.wrapperStyle;
var headerStyle = _props.headerStyle;
var bodyStyle = _props.bodyStyle;
var footerStyle = _props.footerStyle;
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var tHead = void 0;
var tFoot = void 0;
var tBody = void 0;
_react2.default.Children.forEach(children, function (child) {
if (!_react2.default.isValidElement(child)) return;
var muiName = child.type.muiName;
if (muiName === 'TableBody') {
tBody = _this2.createTableBody(child);
} else if (muiName === 'TableHeader') {
tHead = _this2.createTableHeader(child);
} else if (muiName === 'TableFooter') {
tFoot = _this2.createTableFooter(child);
}
});
// If we could not find a table-header and a table-body, do not attempt to display anything.
if (!tBody && !tHead) return null;
var mergedTableStyle = (0, _simpleAssign2.default)(styles.root, style);
var headerTable = void 0;
var footerTable = void 0;
var inlineHeader = void 0;
var inlineFooter = void 0;
if (fixedHeader) {
headerTable = _react2.default.createElement(
'div',
{ style: prepareStyles((0, _simpleAssign2.default)({}, headerStyle)) },
_react2.default.createElement(
'table',
{ className: className, style: mergedTableStyle },
tHead
)
);
} else {
inlineHeader = tHead;
}
if (tFoot !== undefined) {
if (fixedFooter) {
footerTable = _react2.default.createElement(
'div',
{ style: prepareStyles((0, _simpleAssign2.default)({}, footerStyle)) },
_react2.default.createElement(
'table',
{ className: className, style: prepareStyles(mergedTableStyle) },
tFoot
)
);
} else {
inlineFooter = tFoot;
}
}
return _react2.default.createElement(
'div',
{ style: prepareStyles((0, _simpleAssign2.default)(styles.tableWrapper, wrapperStyle)) },
headerTable,
_react2.default.createElement(
'div',
{ style: prepareStyles((0, _simpleAssign2.default)(styles.bodyTable, bodyStyle)), ref: 'tableDiv' },
_react2.default.createElement(
'table',
{ className: className, style: mergedTableStyle, ref: 'tableBody' },
inlineHeader,
inlineFooter,
tBody
)
),
footerTable
);
}
}]);
return Table;
}(_react.Component);
Table.propTypes = {
/**
* Set to true to indicate that all rows should be selected.
*/
allRowsSelected: _react.PropTypes.bool,
/**
* Override the inline-styles of the body's table element.
*/
bodyStyle: _react.PropTypes.object,
/**
* Children passed to table.
*/
children: _react.PropTypes.node,
/**
* The css class name of the root element.
*/
className: _react.PropTypes.string,
/**
* If true, the footer will appear fixed below the table.
* The default value is true.
*/
fixedFooter: _react.PropTypes.bool,
/**
* If true, the header will appear fixed above the table.
* The default value is true.
*/
fixedHeader: _react.PropTypes.bool,
/**
* Override the inline-styles of the footer's table element.
*/
footerStyle: _react.PropTypes.object,
/**
* Override the inline-styles of the header's table element.
*/
headerStyle: _react.PropTypes.object,
/**
* The height of the table.
*/
height: _react.PropTypes.string,
/**
* If true, multiple table rows can be selected.
* CTRL/CMD+Click and SHIFT+Click are valid actions.
* The default value is false.
*/
multiSelectable: _react.PropTypes.bool,
/**
* Called when a row cell is clicked.
* rowNumber is the row number and columnId is
* the column number or the column key.
*/
onCellClick: _react.PropTypes.func,
/**
* Called when a table cell is hovered.
* rowNumber is the row number of the hovered row
* and columnId is the column number or the column key of the cell.
*/
onCellHover: _react.PropTypes.func,
/**
* Called when a table cell is no longer hovered.
* rowNumber is the row number of the row and columnId
* is the column number or the column key of the cell.
*/
onCellHoverExit: _react.PropTypes.func,
/**
* Called when a table row is hovered.
* rowNumber is the row number of the hovered row.
*/
onRowHover: _react.PropTypes.func,
/**
* Called when a table row is no longer hovered.
* rowNumber is the row number of the row that is no longer hovered.
*/
onRowHoverExit: _react.PropTypes.func,
/**
* Called when a row is selected.
* selectedRows is an array of all row selections.
* IF all rows have been selected, the string "all"
* will be returned instead to indicate that all rows have been selected.
*/
onRowSelection: _react.PropTypes.func,
/**
* If true, table rows can be selected.
* If multiple row selection is desired, enable multiSelectable.
* The default value is true.
*/
selectable: _react.PropTypes.bool,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
/**
* Override the inline-styles of the table's wrapper element.
*/
wrapperStyle: _react.PropTypes.object
};
Table.defaultProps = {
allRowsSelected: false,
fixedFooter: true,
fixedHeader: true,
height: 'inherit',
multiSelectable: false,
selectable: true
};
Table.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = Table;
/***/ },
/* 163 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.TableRowColumn = exports.TableRow = exports.TableHeaderColumn = exports.TableHeader = exports.TableFooter = exports.TableBody = exports.Table = undefined;
var _Table2 = __webpack_require__(162);
var _Table3 = _interopRequireDefault(_Table2);
var _TableBody2 = __webpack_require__(69);
var _TableBody3 = _interopRequireDefault(_TableBody2);
var _TableFooter2 = __webpack_require__(70);
var _TableFooter3 = _interopRequireDefault(_TableFooter2);
var _TableHeader2 = __webpack_require__(71);
var _TableHeader3 = _interopRequireDefault(_TableHeader2);
var _TableHeaderColumn2 = __webpack_require__(40);
var _TableHeaderColumn3 = _interopRequireDefault(_TableHeaderColumn2);
var _TableRow2 = __webpack_require__(72);
var _TableRow3 = _interopRequireDefault(_TableRow2);
var _TableRowColumn2 = __webpack_require__(29);
var _TableRowColumn3 = _interopRequireDefault(_TableRowColumn2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
exports.Table = _Table3.default;
exports.TableBody = _TableBody3.default;
exports.TableFooter = _TableFooter3.default;
exports.TableHeader = _TableHeader3.default;
exports.TableHeaderColumn = _TableHeaderColumn3.default;
exports.TableRow = _TableRow3.default;
exports.TableRowColumn = _TableRowColumn3.default;
exports.default = _Table3.default;
/***/ },
/* 164 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _transitions = __webpack_require__(3);
var _transitions2 = _interopRequireDefault(_transitions);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var inkBar = context.muiTheme.inkBar;
return {
root: {
left: props.left,
width: props.width,
bottom: 0,
display: 'block',
backgroundColor: props.color || inkBar.backgroundColor,
height: 2,
marginTop: -2,
position: 'relative',
transition: _transitions2.default.easeOut('1s', 'left')
}
};
}
var InkBar = function (_Component) {
_inherits(InkBar, _Component);
function InkBar() {
_classCallCheck(this, InkBar);
return _possibleConstructorReturn(this, Object.getPrototypeOf(InkBar).apply(this, arguments));
}
_createClass(InkBar, [{
key: 'render',
value: function render() {
var style = this.props.style;
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
return _react2.default.createElement('div', { style: prepareStyles((0, _simpleAssign2.default)(styles.root, style)) });
}
}]);
return InkBar;
}(_react.Component);
InkBar.propTypes = {
color: _react.PropTypes.string,
left: _react.PropTypes.string.isRequired,
/**
* Override the inline-styles of the root element.
*/
style: _react.PropTypes.object,
width: _react.PropTypes.string.isRequired
};
InkBar.contextTypes = {
muiTheme: _react.PropTypes.object.isRequired
};
exports.default = InkBar;
/***/ },
/* 165 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
var TabTemplate = function (_Component) {
_inherits(TabTemplate, _Component);
function TabTemplate() {
_classCallCheck(this, TabTemplate);
return _possibleConstructorReturn(this, Object.getPrototypeOf(TabTemplate).apply(this, arguments));
}
_createClass(TabTemplate, [{
key: 'render',
value: function render() {
var styles = {
width: '100%',
position: 'relative',
textAlign: 'initial'
};
if (!this.props.selected) {
styles.height = 0;
styles.overflow = 'hidden';
}
return _react2.default.createElement(
'div',
{ style: styles },
this.props.children
);
}
}]);
return TabTemplate;
}(_react.Component);
TabTemplate.propTypes = {
children: _react.PropTypes.node,
selected: _react.PropTypes.bool
};
exports.default = TabTemplate;
/***/ },
/* 166 */
/***/ function(module, exports, __webpack_require__) {
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
var _simpleAssign = __webpack_require__(2);
var _simpleAssign2 = _interopRequireDefault(_simpleAssign);
var _react = __webpack_require__(1);
var _react2 = _interopRequireDefault(_react);
var _reactDom = __webpack_require__(4);
var _reactDom2 = _interopRequireDefault(_reactDom);
var _TabTemplate = __webpack_require__(165);
var _TabTemplate2 = _interopRequireDefault(_TabTemplate);
var _InkBar = __webpack_require__(164);
var _InkBar2 = _interopRequireDefault(_InkBar);
var _warning = __webpack_require__(6);
var _warning2 = _interopRequireDefault(_warning);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
function getStyles(props, context) {
var tabs = context.muiTheme.tabs;
return {
tabItemContainer: {
width: '100%',
backgroundColor: tabs.backgroundColor,
whiteSpace: 'nowrap'
}
};
}
var Tabs = function (_Component) {
_inherits(Tabs, _Component);
function Tabs() {
var _Object$getPrototypeO;
var _temp, _this, _ret;
_classCallCheck(this, Tabs);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(Tabs)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.state = { selectedIndex: 0 }, _this.handleTabTouchTap = function (value, event, tab) {
var valueLink = _this.getValueLink(_this.props);
var tabIndex = tab.props.tabIndex;
if (valueLink.value && valueLink.value !== value || _this.state.selectedIndex !== tabIndex) {
valueLink.requestChange(value, event, tab);
}
_this.setState({ selectedIndex: tabIndex });
if (tab.props.onActive) {
tab.props.onActive(tab);
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
_createClass(Tabs, [{
key: 'componentWillMount',
value: function componentWillMount() {
var valueLink = this.getValueLink(this.props);
var initialIndex = this.props.initialSelectedIndex;
this.setState({
selectedIndex: valueLink.value !== undefined ? this.getSelectedIndex(this.props) : initialIndex < this.getTabCount() ? initialIndex : 0
});
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(newProps, nextContext) {
var valueLink = this.getValueLink(newProps);
var newState = {
muiTheme: nextContext.muiTheme || this.context.muiTheme
};
if (valueLink.value !== undefined) {
newState.selectedIndex = this.getSelectedIndex(newProps);
}
this.setState(newState);
}
}, {
key: 'getEvenWidth',
value: function getEvenWidth() {
return parseInt(window.getComputedStyle(_reactDom2.default.findDOMNode(this)).getPropertyValue('width'), 10);
}
}, {
key: 'getTabs',
value: function getTabs() {
var tabs = [];
_react2.default.Children.forEach(this.props.children, function (tab) {
if (_react2.default.isValidElement(tab)) {
tabs.push(tab);
}
});
return tabs;
}
}, {
key: 'getTabCount',
value: function getTabCount() {
return this.getTabs().length;
}
// Do not use outside of this component, it will be removed once valueLink is deprecated
}, {
key: 'getValueLink',
value: function getValueLink(props) {
return props.valueLink || {
value: props.value,
requestChange: props.onChange
};
}
}, {
key: 'getSelectedIndex',
value: function getSelectedIndex(props) {
var valueLink = this.getValueLink(props);
var selectedIndex = -1;
this.getTabs().forEach(function (tab, index) {
if (valueLink.value === tab.props.value) {
selectedIndex = index;
}
});
return selectedIndex;
}
}, {
key: 'getSelected',
value: function getSelected(tab, index) {
var valueLink = this.getValueLink(this.props);
return valueLink.value ? valueLink.value === tab.props.value : this.state.selectedIndex === index;
}
}, {
key: 'render',
value: function render() {
var _this2 = this;
var _props = this.props;
var contentContainerClassName = _props.contentContainerClassName;
var contentContainerStyle = _props.contentContainerStyle;
var initialSelectedIndex = _props.initialSelectedIndex;
var // eslint-disable-line no-unused-vars
inkBarStyle = _props.inkBarStyle;
var style = _props.style;
var tabItemContainerStyle = _props.tabItemContainerStyle;
var tabTemplate = _props.tabTemplate;
var other = _objectWithoutProperties(_props, ['contentContainerClassName', 'contentContainerStyle', 'initialSelectedIndex', 'inkBarStyle', 'style', 'tabItemContainerStyle', 'tabTemplate']);
var prepareStyles = this.context.muiTheme.prepareStyles;
var styles = getStyles(this.props, this.context);
var valueLink = this.getValueLink(this.props);
var tabValue = valueLink.value;
var tabContent = [];
var width = 100 / this.getTabCount();
var tabs = this.getTabs().map(function (tab, index) {
true ? (0, _warning2.default)(tab.type && tab.type.muiName === 'Tab', 'Tabs only accepts Tab Components as children.\n Found ' + (tab.type.muiName || tab.type) + ' as child number ' + (index + 1) + ' of Tabs') : void 0;
true ? (0, _warning2.default)(!tabValue || tab.props.value !== undefined, 'Tabs value prop has been passed, but Tab ' + index + '\n does not have a value prop. Needs value if Tabs is going\n to be a controlled component.') : void 0;
tabContent.push(tab.props.children ? _react2.default.createElement(tabTemplate || _TabTemplate2.default, {
key: index,
selected: _this2.getSelected(tab, index)
}, tab.props.children) : undefined);
return _react2.default.cloneElement(tab, {
key: index,
selected: _this2.getSelected(tab, index),
tabIndex: index,
width: width + '%',
onTouchTap: _this2.handleTabTouchTap
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment