Completely updated React, fixed #11, (hopefully)

This commit is contained in:
2018-03-04 19:11:49 -05:00
parent 6e0afd6e2a
commit 34e5f5139a
13674 changed files with 333464 additions and 473223 deletions

View File

@@ -1,17 +0,0 @@
import * as React from 'react';
import { StandardProps } from '..';
export interface BackdropProps extends StandardProps<{}, BackdropClassKey> {
invisible?: boolean;
onClick?: React.ReactEventHandler<{}>;
[prop: string]: any;
}
export type BackdropClassKey =
| 'root'
| 'invisible'
;
declare const Backdrop: React.ComponentType<BackdropProps>;
export default Backdrop;

View File

@@ -1,111 +0,0 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.styles = undefined;
var _extends2 = require('babel-runtime/helpers/extends');
var _extends3 = _interopRequireDefault(_extends2);
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
var _ref;
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _classnames = require('classnames');
var _classnames2 = _interopRequireDefault(_classnames);
var _withStyles = require('../styles/withStyles');
var _withStyles2 = _interopRequireDefault(_withStyles);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var babelPluginFlowReactPropTypes_proptype_Node = require('react').babelPluginFlowReactPropTypes_proptype_Node || require('prop-types').any;
var styles = exports.styles = function styles(theme) {
return {
root: {
zIndex: -1,
width: '100%',
height: '100%',
position: 'fixed',
top: 0,
left: 0,
// Remove grey highlight
WebkitTapHighlightColor: theme.palette.common.transparent,
backgroundColor: theme.palette.common.lightBlack,
transition: theme.transitions.create('opacity'),
willChange: 'opacity',
opacity: 0
},
invisible: {
backgroundColor: theme.palette.common.transparent
}
};
};
var babelPluginFlowReactPropTypes_proptype_Props = {
/**
* Can be used, for instance, to render a letter inside the avatar.
*/
children: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node),
/**
* Useful to extend the style applied to components.
*/
classes: require('prop-types').object,
/**
* @ignore
*/
className: require('prop-types').string,
/**
* If `true`, the backdrop is invisible.
*/
invisible: require('prop-types').bool
};
/**
* @ignore - internal component.
*/
function Backdrop(props) {
var children = props.children,
classes = props.classes,
className = props.className,
invisible = props.invisible,
other = (0, _objectWithoutProperties3.default)(props, ['children', 'classes', 'className', 'invisible']);
var backdropClass = (0, _classnames2.default)(classes.root, (0, _defineProperty3.default)({}, classes.invisible, invisible), className);
return _react2.default.createElement(
'div',
(0, _extends3.default)({ className: backdropClass, 'aria-hidden': 'true' }, other),
children
);
}
Backdrop.propTypes = process.env.NODE_ENV !== "production" ? (_ref = {
classes: require('prop-types').object.isRequired,
children: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node)
}, (0, _defineProperty3.default)(_ref, 'classes', require('prop-types').object), (0, _defineProperty3.default)(_ref, 'className', require('prop-types').string), (0, _defineProperty3.default)(_ref, 'invisible', require('prop-types').bool), _ref) : {};
Backdrop.defaultProps = {
invisible: false
};
exports.default = (0, _withStyles2.default)(styles, { name: 'MuiBackdrop' })(Backdrop);

View File

@@ -1,76 +0,0 @@
// @flow
import React from 'react';
import type { Node } from 'react';
import classNames from 'classnames';
import withStyles from '../styles/withStyles';
export const styles = (theme: Object) => ({
root: {
zIndex: -1,
width: '100%',
height: '100%',
position: 'fixed',
top: 0,
left: 0,
// Remove grey highlight
WebkitTapHighlightColor: theme.palette.common.transparent,
backgroundColor: theme.palette.common.lightBlack,
transition: theme.transitions.create('opacity'),
willChange: 'opacity',
opacity: 0,
},
invisible: {
backgroundColor: theme.palette.common.transparent,
},
});
type ProvidedProps = {
classes: Object,
};
export type Props = {
/**
* Can be used, for instance, to render a letter inside the avatar.
*/
children?: Node,
/**
* Useful to extend the style applied to components.
*/
classes?: Object,
/**
* @ignore
*/
className?: string,
/**
* If `true`, the backdrop is invisible.
*/
invisible?: boolean,
};
/**
* @ignore - internal component.
*/
function Backdrop(props: ProvidedProps & Props) {
const { children, classes, className, invisible, ...other } = props;
const backdropClass = classNames(
classes.root,
{
[classes.invisible]: invisible,
},
className,
);
return (
<div data-mui-test="Backdrop" className={backdropClass} aria-hidden="true" {...other}>
{children}
</div>
);
}
Backdrop.defaultProps = {
invisible: false,
};
export default withStyles(styles, { name: 'MuiBackdrop' })(Backdrop);

View File

@@ -1,32 +0,0 @@
import * as React from 'react';
import { StandardProps } from '..';
import { BackdropProps } from './Backdrop';
import { TransitionDuration, TransitionHandlers } from './transition';
export interface ModalProps extends StandardProps<
React.HtmlHTMLAttributes<HTMLDivElement> & Partial<TransitionHandlers>,
ModalClassKey
> {
BackdropClassName?: string;
BackdropComponent?: string | React.ComponentType<BackdropProps>;
BackdropInvisible?: boolean;
BackdropTransitionDuration?: TransitionDuration;
keepMounted?: boolean;
disableBackdrop?: boolean;
ignoreBackdropClick?: boolean;
ignoreEscapeKeyUp?: boolean;
modalManager?: Object;
onBackdropClick?: React.ReactEventHandler<{}>;
onEscapeKeyUp?: React.ReactEventHandler<{}>;
onRequestClose?: React.ReactEventHandler<{}>;
show?: boolean;
}
export type ModalClassKey =
| 'root'
| 'hidden'
;
declare const Modal: React.ComponentType<ModalProps>;
export default Modal;

View File

@@ -1,583 +0,0 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.styles = undefined;
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
var _keys = require('babel-runtime/core-js/object/keys');
var _keys2 = _interopRequireDefault(_keys);
var _objectWithoutProperties2 = require('babel-runtime/helpers/objectWithoutProperties');
var _objectWithoutProperties3 = _interopRequireDefault(_objectWithoutProperties2);
var _extends2 = require('babel-runtime/helpers/extends');
var _extends3 = _interopRequireDefault(_extends2);
var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require('babel-runtime/helpers/createClass');
var _createClass3 = _interopRequireDefault(_createClass2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _reactDom = require('react-dom');
var _reactDom2 = _interopRequireDefault(_reactDom);
var _classnames = require('classnames');
var _classnames2 = _interopRequireDefault(_classnames);
var _warning = require('warning');
var _warning2 = _interopRequireDefault(_warning);
var _keycode = require('keycode');
var _keycode2 = _interopRequireDefault(_keycode);
var _inDOM = require('dom-helpers/util/inDOM');
var _inDOM2 = _interopRequireDefault(_inDOM);
var _contains = require('dom-helpers/query/contains');
var _contains2 = _interopRequireDefault(_contains);
var _activeElement = require('dom-helpers/activeElement');
var _activeElement2 = _interopRequireDefault(_activeElement);
var _ownerDocument = require('dom-helpers/ownerDocument');
var _ownerDocument2 = _interopRequireDefault(_ownerDocument);
var _addEventListener = require('../utils/addEventListener');
var _addEventListener2 = _interopRequireDefault(_addEventListener);
var _helpers = require('../utils/helpers');
var _Fade = require('../transitions/Fade');
var _Fade2 = _interopRequireDefault(_Fade);
var _withStyles = require('../styles/withStyles');
var _withStyles2 = _interopRequireDefault(_withStyles);
var _modalManager = require('./modalManager');
var _modalManager2 = _interopRequireDefault(_modalManager);
var _Backdrop = require('./Backdrop');
var _Backdrop2 = _interopRequireDefault(_Backdrop);
var _Portal = require('./Portal');
var _Portal2 = _interopRequireDefault(_Portal);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var babelPluginFlowReactPropTypes_proptype_ElementType = require('react').babelPluginFlowReactPropTypes_proptype_ElementType || require('prop-types').any;
var babelPluginFlowReactPropTypes_proptype_Element = require('react').babelPluginFlowReactPropTypes_proptype_Element || require('prop-types').any;
// Modals don't open on the server so this won't break concurrency.
// Could also put this on context.
var babelPluginFlowReactPropTypes_proptype_TransitionCallback = require('../internal/transition').babelPluginFlowReactPropTypes_proptype_TransitionCallback || require('prop-types').any;
var babelPluginFlowReactPropTypes_proptype_TransitionDuration = require('../internal/transition').babelPluginFlowReactPropTypes_proptype_TransitionDuration || require('prop-types').any;
var modalManager = (0, _modalManager2.default)();
var styles = exports.styles = function styles(theme) {
return {
root: {
display: 'flex',
width: '100%',
height: '100%',
position: 'fixed',
zIndex: theme.zIndex.dialog,
top: 0,
left: 0
},
hidden: {
visibility: 'hidden'
}
};
};
var babelPluginFlowReactPropTypes_proptype_Props = {
/**
* The CSS class name of the backdrop element.
*/
BackdropClassName: require('prop-types').string,
/**
* Pass a component class to use as the backdrop.
*/
BackdropComponent: typeof babelPluginFlowReactPropTypes_proptype_ElementType === 'function' ? babelPluginFlowReactPropTypes_proptype_ElementType : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_ElementType),
/**
* If `true`, the backdrop is invisible.
*/
BackdropInvisible: require('prop-types').bool,
/**
* The duration for the backdrop transition, in milliseconds.
* You may specify a single timeout for all transitions, or individually with an object.
*/
BackdropTransitionDuration: typeof babelPluginFlowReactPropTypes_proptype_TransitionDuration === 'function' ? babelPluginFlowReactPropTypes_proptype_TransitionDuration : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_TransitionDuration),
/**
* A single child content element.
*/
children: typeof babelPluginFlowReactPropTypes_proptype_Element === 'function' ? babelPluginFlowReactPropTypes_proptype_Element : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Element),
/**
* Useful to extend the style applied to components.
*/
classes: require('prop-types').object,
/**
* @ignore
*/
className: require('prop-types').string,
/**
* Always keep the children in the DOM.
* This property can be useful in SEO situation or
* when you want to maximize the responsiveness of the Modal.
*/
keepMounted: require('prop-types').bool,
/**
* If `true`, the backdrop is disabled.
*/
disableBackdrop: require('prop-types').bool,
/**
* If `true`, clicking the backdrop will not fire the `onRequestClose` callback.
*/
ignoreBackdropClick: require('prop-types').bool,
/**
* If `true`, hitting escape will not fire the `onRequestClose` callback.
*/
ignoreEscapeKeyUp: require('prop-types').bool,
/**
* @ignore
*/
modalManager: require('prop-types').object,
/**
* Callback fires when the backdrop is clicked on.
*/
onBackdropClick: require('prop-types').func,
/**
* Callback fired before the modal is entering.
*/
onEnter: typeof babelPluginFlowReactPropTypes_proptype_TransitionCallback === 'function' ? babelPluginFlowReactPropTypes_proptype_TransitionCallback : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_TransitionCallback),
/**
* Callback fired when the modal is entering.
*/
onEntering: typeof babelPluginFlowReactPropTypes_proptype_TransitionCallback === 'function' ? babelPluginFlowReactPropTypes_proptype_TransitionCallback : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_TransitionCallback),
/**
* Callback fired when the modal has entered.
*/
onEntered: typeof babelPluginFlowReactPropTypes_proptype_TransitionCallback === 'function' ? babelPluginFlowReactPropTypes_proptype_TransitionCallback : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_TransitionCallback),
/**
* Callback fires when the escape key is pressed and the modal is in focus.
*/
onEscapeKeyUp: require('prop-types').func,
/**
* Callback fired before the modal is exiting.
*/
onExit: typeof babelPluginFlowReactPropTypes_proptype_TransitionCallback === 'function' ? babelPluginFlowReactPropTypes_proptype_TransitionCallback : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_TransitionCallback),
/**
* Callback fired when the modal is exiting.
*/
onExiting: typeof babelPluginFlowReactPropTypes_proptype_TransitionCallback === 'function' ? babelPluginFlowReactPropTypes_proptype_TransitionCallback : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_TransitionCallback),
/**
* Callback fired when the modal has exited.
*/
onExited: typeof babelPluginFlowReactPropTypes_proptype_TransitionCallback === 'function' ? babelPluginFlowReactPropTypes_proptype_TransitionCallback : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_TransitionCallback),
/**
* Callback fired when the component requests to be closed.
*
* @param {object} event The event source of the callback
*/
onRequestClose: require('prop-types').func,
/**
* If `true`, the Modal is visible.
*/
show: require('prop-types').bool
};
/**
* @ignore - internal component.
*/
var Modal = function (_React$Component) {
(0, _inherits3.default)(Modal, _React$Component);
function Modal() {
var _ref;
var _temp, _this, _ret;
(0, _classCallCheck3.default)(this, Modal);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = Modal.__proto__ || (0, _getPrototypeOf2.default)(Modal)).call.apply(_ref, [this].concat(args))), _this), _initialiseProps.call(_this), _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
}
(0, _createClass3.default)(Modal, [{
key: 'componentWillMount',
value: function componentWillMount() {
if (!this.props.show) {
this.setState({ exited: true });
}
}
}, {
key: 'componentDidMount',
value: function componentDidMount() {
this.mounted = true;
if (this.props.show) {
this.handleShow();
}
}
}, {
key: 'componentWillReceiveProps',
value: function componentWillReceiveProps(nextProps) {
if (nextProps.show && this.state.exited) {
this.setState({ exited: false });
}
}
}, {
key: 'componentWillUpdate',
value: function componentWillUpdate(nextProps) {
if (!this.props.show && nextProps.show) {
this.checkForFocus();
}
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate(prevProps) {
if (!prevProps.show && this.props.show) {
this.handleShow();
}
// We are waiting for the onExited callback to call handleHide.
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
if (this.props.show || !this.state.exited) {
this.handleHide();
}
this.mounted = false;
}
}, {
key: 'checkForFocus',
value: function checkForFocus() {
if (_inDOM2.default) {
this.lastFocus = (0, _activeElement2.default)();
}
}
}, {
key: 'restoreLastFocus',
value: function restoreLastFocus() {
if (this.lastFocus && this.lastFocus.focus) {
this.lastFocus.focus();
this.lastFocus = undefined;
}
}
}, {
key: 'handleShow',
value: function handleShow() {
var doc = (0, _ownerDocument2.default)(_reactDom2.default.findDOMNode(this));
this.props.modalManager.add(this);
this.onDocumentKeyUpListener = (0, _addEventListener2.default)(doc, 'keyup', this.handleDocumentKeyUp);
this.onFocusListener = (0, _addEventListener2.default)(doc, 'focus', this.handleFocusListener, true);
this.focus();
}
}, {
key: 'focus',
value: function focus() {
var currentFocus = (0, _activeElement2.default)((0, _ownerDocument2.default)(_reactDom2.default.findDOMNode(this)));
var modalContent = this.modal && this.modal.lastChild;
var focusInModal = currentFocus && (0, _contains2.default)(modalContent, currentFocus);
if (modalContent && !focusInModal) {
if (!modalContent.hasAttribute('tabIndex')) {
modalContent.setAttribute('tabIndex', -1);
process.env.NODE_ENV !== "production" ? (0, _warning2.default)(false, 'Material-UI: the modal content node does not accept focus. ' + 'For the benefit of assistive technologies, ' + 'the tabIndex of the node is being set to "-1".') : void 0;
}
modalContent.focus();
}
}
}, {
key: 'handleHide',
value: function handleHide() {
this.props.modalManager.remove(this);
if (this.onDocumentKeyUpListener) this.onDocumentKeyUpListener.remove();
if (this.onFocusListener) this.onFocusListener.remove();
this.restoreLastFocus();
}
}, {
key: 'renderBackdrop',
value: function renderBackdrop() {
var other = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
var _props = this.props,
BackdropComponent = _props.BackdropComponent,
BackdropClassName = _props.BackdropClassName,
BackdropTransitionDuration = _props.BackdropTransitionDuration,
BackdropInvisible = _props.BackdropInvisible,
show = _props.show;
return _react2.default.createElement(
_Fade2.default,
(0, _extends3.default)({ appear: true, 'in': show, timeout: BackdropTransitionDuration }, other),
_react2.default.createElement(BackdropComponent, {
invisible: BackdropInvisible,
className: BackdropClassName,
onClick: this.handleBackdropClick
})
);
}
}, {
key: 'render',
value: function render() {
var _this2 = this;
var _props2 = this.props,
disableBackdrop = _props2.disableBackdrop,
BackdropComponent = _props2.BackdropComponent,
BackdropClassName = _props2.BackdropClassName,
BackdropTransitionDuration = _props2.BackdropTransitionDuration,
BackdropInvisible = _props2.BackdropInvisible,
ignoreBackdropClick = _props2.ignoreBackdropClick,
ignoreEscapeKeyUp = _props2.ignoreEscapeKeyUp,
children = _props2.children,
classes = _props2.classes,
className = _props2.className,
keepMounted = _props2.keepMounted,
modalManagerProp = _props2.modalManager,
onBackdropClick = _props2.onBackdropClick,
onEscapeKeyUp = _props2.onEscapeKeyUp,
onRequestClose = _props2.onRequestClose,
onEnter = _props2.onEnter,
onEntering = _props2.onEntering,
onEntered = _props2.onEntered,
onExit = _props2.onExit,
onExiting = _props2.onExiting,
onExited = _props2.onExited,
show = _props2.show,
other = (0, _objectWithoutProperties3.default)(_props2, ['disableBackdrop', 'BackdropComponent', 'BackdropClassName', 'BackdropTransitionDuration', 'BackdropInvisible', 'ignoreBackdropClick', 'ignoreEscapeKeyUp', 'children', 'classes', 'className', 'keepMounted', 'modalManager', 'onBackdropClick', 'onEscapeKeyUp', 'onRequestClose', 'onEnter', 'onEntering', 'onEntered', 'onExit', 'onExiting', 'onExited', 'show']);
if (!keepMounted && !show && this.state.exited) {
return null;
}
var transitionCallbacks = {
onEnter: onEnter,
onEntering: onEntering,
onEntered: onEntered,
onExit: onExit,
onExiting: onExiting,
onExited: this.handleTransitionExited
};
var modalChild = _react2.default.Children.only(children);
var _modalChild$props = modalChild.props,
role = _modalChild$props.role,
tabIndex = _modalChild$props.tabIndex;
var childProps = {};
if (role === undefined) {
childProps.role = role === undefined ? 'document' : role;
}
if (tabIndex === undefined) {
childProps.tabIndex = tabIndex == null ? -1 : tabIndex;
}
var backdropProps = void 0;
// It's a Transition like component
if (modalChild.props.hasOwnProperty('in')) {
(0, _keys2.default)(transitionCallbacks).forEach(function (key) {
childProps[key] = (0, _helpers.createChainedFunction)(transitionCallbacks[key], modalChild.props[key]);
});
} else {
backdropProps = transitionCallbacks;
}
if ((0, _keys2.default)(childProps).length) {
modalChild = _react2.default.cloneElement(modalChild, childProps);
}
return _react2.default.createElement(
_Portal2.default,
{
open: true,
ref: function ref(node) {
_this2.mountNode = node ? node.getLayer() : null;
}
},
_react2.default.createElement(
'div',
(0, _extends3.default)({
className: (0, _classnames2.default)(classes.root, className, (0, _defineProperty3.default)({}, classes.hidden, this.state.exited))
}, other, {
ref: function ref(node) {
_this2.modal = node;
}
}),
!disableBackdrop && (!keepMounted || show || !this.state.exited) && this.renderBackdrop(backdropProps),
modalChild
)
);
}
}]);
return Modal;
}(_react2.default.Component);
Modal.defaultProps = {
BackdropComponent: _Backdrop2.default,
BackdropTransitionDuration: 300,
BackdropInvisible: false,
keepMounted: false,
disableBackdrop: false,
ignoreBackdropClick: false,
ignoreEscapeKeyUp: false,
modalManager: modalManager,
show: false
};
var _initialiseProps = function _initialiseProps() {
var _this3 = this;
this.state = {
exited: false
};
this.onDocumentKeyUpListener = null;
this.onFocusListener = null;
this.mounted = false;
this.lastFocus = undefined;
this.modal = null;
this.mountNode = null;
this.handleFocusListener = function () {
if (!_this3.mounted || !_this3.props.modalManager.isTopModal(_this3)) {
return;
}
var currentFocus = (0, _activeElement2.default)((0, _ownerDocument2.default)(_reactDom2.default.findDOMNode(_this3)));
var modalContent = _this3.modal && _this3.modal.lastChild;
if (modalContent && modalContent !== currentFocus && !(0, _contains2.default)(modalContent, currentFocus)) {
modalContent.focus();
}
};
this.handleDocumentKeyUp = function (event) {
if (!_this3.mounted || !_this3.props.modalManager.isTopModal(_this3)) {
return;
}
if ((0, _keycode2.default)(event) !== 'esc') {
return;
}
var _props3 = _this3.props,
onEscapeKeyUp = _props3.onEscapeKeyUp,
onRequestClose = _props3.onRequestClose,
ignoreEscapeKeyUp = _props3.ignoreEscapeKeyUp;
if (onEscapeKeyUp) {
onEscapeKeyUp(event);
}
if (onRequestClose && !ignoreEscapeKeyUp) {
onRequestClose(event);
}
};
this.handleBackdropClick = function (event) {
if (event.target !== event.currentTarget) {
return;
}
var _props4 = _this3.props,
onBackdropClick = _props4.onBackdropClick,
onRequestClose = _props4.onRequestClose,
ignoreBackdropClick = _props4.ignoreBackdropClick;
if (onBackdropClick) {
onBackdropClick(event);
}
if (onRequestClose && !ignoreBackdropClick) {
onRequestClose(event);
}
};
this.handleTransitionExited = function () {
if (_this3.props.onExited) {
var _props5;
(_props5 = _this3.props).onExited.apply(_props5, arguments);
}
_this3.setState({ exited: true });
_this3.handleHide();
};
};
exports.default = (0, _withStyles2.default)(styles, { flip: false, name: 'MuiModal' })(Modal);

View File

@@ -1,435 +0,0 @@
// @flow
import React from 'react';
import type { Element, ElementType } from 'react';
import ReactDOM from 'react-dom';
import classNames from 'classnames';
import warning from 'warning';
import keycode from 'keycode';
import canUseDom from 'dom-helpers/util/inDOM';
import contains from 'dom-helpers/query/contains';
import activeElement from 'dom-helpers/activeElement';
import ownerDocument from 'dom-helpers/ownerDocument';
import addEventListener from '../utils/addEventListener';
import { createChainedFunction } from '../utils/helpers';
import Fade from '../transitions/Fade';
import withStyles from '../styles/withStyles';
import createModalManager from './modalManager';
import Backdrop from './Backdrop';
import Portal from './Portal';
import type { TransitionDuration, TransitionCallback } from '../internal/transition';
// Modals don't open on the server so this won't break concurrency.
// Could also put this on context.
const modalManager = createModalManager();
export const styles = (theme: Object) => ({
root: {
display: 'flex',
width: '100%',
height: '100%',
position: 'fixed',
zIndex: theme.zIndex.dialog,
top: 0,
left: 0,
},
hidden: {
visibility: 'hidden',
},
});
type ProvidedProps = {
BackdropComponent: ElementType,
classes: Object,
modalManager: Object,
show: boolean,
};
export type Props = {
/**
* The CSS class name of the backdrop element.
*/
BackdropClassName?: string,
/**
* Pass a component class to use as the backdrop.
*/
BackdropComponent?: ElementType,
/**
* If `true`, the backdrop is invisible.
*/
BackdropInvisible?: boolean,
/**
* The duration for the backdrop transition, in milliseconds.
* You may specify a single timeout for all transitions, or individually with an object.
*/
BackdropTransitionDuration?: TransitionDuration,
/**
* A single child content element.
*/
children?: Element<any>,
/**
* Useful to extend the style applied to components.
*/
classes?: Object,
/**
* @ignore
*/
className?: string,
/**
* Always keep the children in the DOM.
* This property can be useful in SEO situation or
* when you want to maximize the responsiveness of the Modal.
*/
keepMounted?: boolean,
/**
* If `true`, the backdrop is disabled.
*/
disableBackdrop?: boolean,
/**
* If `true`, clicking the backdrop will not fire the `onRequestClose` callback.
*/
ignoreBackdropClick?: boolean,
/**
* If `true`, hitting escape will not fire the `onRequestClose` callback.
*/
ignoreEscapeKeyUp?: boolean,
/**
* @ignore
*/
modalManager?: Object,
/**
* Callback fires when the backdrop is clicked on.
*/
onBackdropClick?: Function,
/**
* Callback fired before the modal is entering.
*/
onEnter?: TransitionCallback,
/**
* Callback fired when the modal is entering.
*/
onEntering?: TransitionCallback,
/**
* Callback fired when the modal has entered.
*/
onEntered?: TransitionCallback,
/**
* Callback fires when the escape key is pressed and the modal is in focus.
*/
onEscapeKeyUp?: Function,
/**
* Callback fired before the modal is exiting.
*/
onExit?: TransitionCallback,
/**
* Callback fired when the modal is exiting.
*/
onExiting?: TransitionCallback,
/**
* Callback fired when the modal has exited.
*/
onExited?: TransitionCallback,
/**
* Callback fired when the component requests to be closed.
*
* @param {object} event The event source of the callback
*/
onRequestClose?: Function,
/**
* If `true`, the Modal is visible.
*/
show?: boolean,
};
type State = {
exited: boolean,
};
/**
* @ignore - internal component.
*/
class Modal extends React.Component<ProvidedProps & Props, State> {
static defaultProps = {
BackdropComponent: Backdrop,
BackdropTransitionDuration: 300,
BackdropInvisible: false,
keepMounted: false,
disableBackdrop: false,
ignoreBackdropClick: false,
ignoreEscapeKeyUp: false,
modalManager,
show: false,
};
state = {
exited: false,
};
componentWillMount() {
if (!this.props.show) {
this.setState({ exited: true });
}
}
componentDidMount() {
this.mounted = true;
if (this.props.show) {
this.handleShow();
}
}
componentWillReceiveProps(nextProps) {
if (nextProps.show && this.state.exited) {
this.setState({ exited: false });
}
}
componentWillUpdate(nextProps) {
if (!this.props.show && nextProps.show) {
this.checkForFocus();
}
}
componentDidUpdate(prevProps) {
if (!prevProps.show && this.props.show) {
this.handleShow();
}
// We are waiting for the onExited callback to call handleHide.
}
componentWillUnmount() {
if (this.props.show || !this.state.exited) {
this.handleHide();
}
this.mounted = false;
}
onDocumentKeyUpListener = null;
onFocusListener = null;
mounted = false;
lastFocus = undefined;
modal = null;
mountNode = null;
checkForFocus() {
if (canUseDom) {
this.lastFocus = activeElement();
}
}
restoreLastFocus() {
if (this.lastFocus && this.lastFocus.focus) {
this.lastFocus.focus();
this.lastFocus = undefined;
}
}
handleShow() {
const doc = ownerDocument(ReactDOM.findDOMNode(this));
this.props.modalManager.add(this);
this.onDocumentKeyUpListener = addEventListener(doc, 'keyup', this.handleDocumentKeyUp);
this.onFocusListener = addEventListener(doc, 'focus', this.handleFocusListener, true);
this.focus();
}
focus() {
const currentFocus = activeElement(ownerDocument(ReactDOM.findDOMNode(this)));
const modalContent = this.modal && this.modal.lastChild;
const focusInModal = currentFocus && contains(modalContent, currentFocus);
if (modalContent && !focusInModal) {
if (!modalContent.hasAttribute('tabIndex')) {
modalContent.setAttribute('tabIndex', -1);
warning(
false,
'Material-UI: the modal content node does not accept focus. ' +
'For the benefit of assistive technologies, ' +
'the tabIndex of the node is being set to "-1".',
);
}
modalContent.focus();
}
}
handleHide() {
this.props.modalManager.remove(this);
if (this.onDocumentKeyUpListener) this.onDocumentKeyUpListener.remove();
if (this.onFocusListener) this.onFocusListener.remove();
this.restoreLastFocus();
}
handleFocusListener = () => {
if (!this.mounted || !this.props.modalManager.isTopModal(this)) {
return;
}
const currentFocus = activeElement(ownerDocument(ReactDOM.findDOMNode(this)));
const modalContent = this.modal && this.modal.lastChild;
if (modalContent && modalContent !== currentFocus && !contains(modalContent, currentFocus)) {
modalContent.focus();
}
};
handleDocumentKeyUp = (event: Event) => {
if (!this.mounted || !this.props.modalManager.isTopModal(this)) {
return;
}
if (keycode(event) !== 'esc') {
return;
}
const { onEscapeKeyUp, onRequestClose, ignoreEscapeKeyUp } = this.props;
if (onEscapeKeyUp) {
onEscapeKeyUp(event);
}
if (onRequestClose && !ignoreEscapeKeyUp) {
onRequestClose(event);
}
};
handleBackdropClick = (event: Event) => {
if (event.target !== event.currentTarget) {
return;
}
const { onBackdropClick, onRequestClose, ignoreBackdropClick } = this.props;
if (onBackdropClick) {
onBackdropClick(event);
}
if (onRequestClose && !ignoreBackdropClick) {
onRequestClose(event);
}
};
handleTransitionExited = (...args) => {
if (this.props.onExited) {
this.props.onExited(...args);
}
this.setState({ exited: true });
this.handleHide();
};
renderBackdrop(other: { [key: string]: any } = {}) {
const {
BackdropComponent,
BackdropClassName,
BackdropTransitionDuration,
BackdropInvisible,
show,
} = this.props;
return (
<Fade appear in={show} timeout={BackdropTransitionDuration} {...other}>
<BackdropComponent
invisible={BackdropInvisible}
className={BackdropClassName}
onClick={this.handleBackdropClick}
/>
</Fade>
);
}
render() {
const {
disableBackdrop,
BackdropComponent,
BackdropClassName,
BackdropTransitionDuration,
BackdropInvisible,
ignoreBackdropClick,
ignoreEscapeKeyUp,
children,
classes,
className,
keepMounted,
modalManager: modalManagerProp,
onBackdropClick,
onEscapeKeyUp,
onRequestClose,
onEnter,
onEntering,
onEntered,
onExit,
onExiting,
onExited,
show,
...other
} = this.props;
if (!keepMounted && !show && this.state.exited) {
return null;
}
const transitionCallbacks = {
onEnter,
onEntering,
onEntered,
onExit,
onExiting,
onExited: this.handleTransitionExited,
};
let modalChild = React.Children.only(children);
const { role, tabIndex } = modalChild.props;
const childProps = {};
if (role === undefined) {
childProps.role = role === undefined ? 'document' : role;
}
if (tabIndex === undefined) {
childProps.tabIndex = tabIndex == null ? -1 : tabIndex;
}
let backdropProps;
// It's a Transition like component
if (modalChild.props.hasOwnProperty('in')) {
Object.keys(transitionCallbacks).forEach(key => {
childProps[key] = createChainedFunction(transitionCallbacks[key], modalChild.props[key]);
});
} else {
backdropProps = transitionCallbacks;
}
if (Object.keys(childProps).length) {
modalChild = React.cloneElement(modalChild, childProps);
}
return (
<Portal
open
ref={node => {
this.mountNode = node ? node.getLayer() : null;
}}
>
<div
data-mui-test="Modal"
className={classNames(classes.root, className, {
[classes.hidden]: this.state.exited,
})}
{...other}
ref={node => {
this.modal = node;
}}
>
{!disableBackdrop &&
(!keepMounted || show || !this.state.exited) &&
this.renderBackdrop(backdropProps)}
{modalChild}
</div>
</Portal>
);
}
}
export default withStyles(styles, { flip: false, name: 'MuiModal' })(Modal);

View File

@@ -1,7 +0,0 @@
import * as React from 'react';
export interface PortalProps {
open?: boolean;
}
export default class Portal extends React.Component<PortalProps> {}

View File

@@ -1,180 +0,0 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require('babel-runtime/helpers/createClass');
var _createClass3 = _interopRequireDefault(_createClass2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _reactDom = require('react-dom');
var _reactDom2 = _interopRequireDefault(_reactDom);
var _inDOM = require('dom-helpers/util/inDOM');
var _inDOM2 = _interopRequireDefault(_inDOM);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var babelPluginFlowReactPropTypes_proptype_Node = require('react').babelPluginFlowReactPropTypes_proptype_Node || require('prop-types').any;
var babelPluginFlowReactPropTypes_proptype_Props = {
/**
* The content to portal in order to escape the parent DOM node.
*/
children: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node),
/**
* If `true` the children will be mounted into the DOM.
*/
open: require('prop-types').bool
};
/**
* @ignore - internal component.
*/
var Portal = function (_React$Component) {
(0, _inherits3.default)(Portal, _React$Component);
function Portal() {
var _ref;
var _temp, _this, _ret;
(0, _classCallCheck3.default)(this, Portal);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = Portal.__proto__ || (0, _getPrototypeOf2.default)(Portal)).call.apply(_ref, [this].concat(args))), _this), _this.layer = null, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
}
(0, _createClass3.default)(Portal, [{
key: 'componentDidMount',
value: function componentDidMount() {
// Support react@15.x, will be removed at some point
if (!_reactDom2.default.createPortal) {
this.renderLayer();
}
}
}, {
key: 'componentDidUpdate',
value: function componentDidUpdate() {
// Support react@15.x, will be removed at some point
if (!_reactDom2.default.createPortal) {
this.renderLayer();
}
}
}, {
key: 'componentWillUnmount',
value: function componentWillUnmount() {
this.unrenderLayer();
}
}, {
key: 'getLayer',
value: function getLayer() {
if (!this.layer) {
this.layer = document.createElement('div');
this.layer.setAttribute('data-mui-portal', 'true');
if (document.body && this.layer) {
document.body.appendChild(this.layer);
}
}
return this.layer;
}
}, {
key: 'unrenderLayer',
value: function unrenderLayer() {
if (!this.layer) {
return;
}
// Support react@15.x, will be removed at some point
if (!_reactDom2.default.createPortal) {
_reactDom2.default.unmountComponentAtNode(this.layer);
}
if (document.body) {
document.body.removeChild(this.layer);
}
this.layer = null;
}
}, {
key: 'renderLayer',
value: function renderLayer() {
var _props = this.props,
children = _props.children,
open = _props.open;
if (open) {
// 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 = _react2.default.Children.only(children);
_reactDom2.default.unstable_renderSubtreeIntoContainer(this, layerElement, this.getLayer());
} else {
this.unrenderLayer();
}
}
}, {
key: 'render',
value: function render() {
var _props2 = this.props,
children = _props2.children,
open = _props2.open;
// Support react@15.x, will be removed at some point
if (!_reactDom2.default.createPortal) {
return null;
}
// Can't be rendered server-side.
if (_inDOM2.default) {
if (open) {
return _reactDom2.default.createPortal(children, this.getLayer());
}
this.unrenderLayer();
}
return null;
}
}]);
return Portal;
}(_react2.default.Component);
Portal.defaultProps = {
open: false
};
Portal.propTypes = process.env.NODE_ENV !== "production" ? {
children: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node),
open: require('prop-types').bool
} : {};
exports.default = Portal;

View File

@@ -1,111 +0,0 @@
// @flow
import React from 'react';
import type { Node } from 'react';
import ReactDOM from 'react-dom';
import canUseDom from 'dom-helpers/util/inDOM';
export type Props = {
/**
* The content to portal in order to escape the parent DOM node.
*/
children?: Node,
/**
* If `true` the children will be mounted into the DOM.
*/
open?: boolean,
};
/**
* @ignore - internal component.
*/
class Portal extends React.Component<Props> {
static defaultProps = {
open: false,
};
componentDidMount() {
// Support react@15.x, will be removed at some point
if (!ReactDOM.createPortal) {
this.renderLayer();
}
}
componentDidUpdate() {
// Support react@15.x, will be removed at some point
if (!ReactDOM.createPortal) {
this.renderLayer();
}
}
componentWillUnmount() {
this.unrenderLayer();
}
getLayer() {
if (!this.layer) {
this.layer = document.createElement('div');
this.layer.setAttribute('data-mui-portal', 'true');
if (document.body && this.layer) {
document.body.appendChild(this.layer);
}
}
return this.layer;
}
layer: ?HTMLElement = null;
unrenderLayer() {
if (!this.layer) {
return;
}
// Support react@15.x, will be removed at some point
if (!ReactDOM.createPortal) {
ReactDOM.unmountComponentAtNode(this.layer);
}
if (document.body) {
document.body.removeChild(this.layer);
}
this.layer = null;
}
renderLayer() {
const { children, open } = this.props;
if (open) {
// 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.
const layerElement = React.Children.only(children);
ReactDOM.unstable_renderSubtreeIntoContainer(this, layerElement, this.getLayer());
} else {
this.unrenderLayer();
}
}
render() {
const { children, open } = this.props;
// Support react@15.x, will be removed at some point
if (!ReactDOM.createPortal) {
return null;
}
// Can't be rendered server-side.
if (canUseDom) {
if (open) {
return ReactDOM.createPortal(children, this.getLayer());
}
this.unrenderLayer();
}
return null;
}
}
export default Portal;

View File

@@ -0,0 +1,64 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require('babel-runtime/helpers/createClass');
var _createClass3 = _interopRequireDefault(_createClass2);
var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
* @ignore - internal component.
*
* Internal helper component to allow attaching a ref to a
* child element that may not accept refs (functional component).
*/
var RefHolder = function (_React$Component) {
(0, _inherits3.default)(RefHolder, _React$Component);
function RefHolder() {
(0, _classCallCheck3.default)(this, RefHolder);
return (0, _possibleConstructorReturn3.default)(this, (RefHolder.__proto__ || (0, _getPrototypeOf2.default)(RefHolder)).apply(this, arguments));
}
(0, _createClass3.default)(RefHolder, [{
key: 'render',
value: function render() {
return this.props.children;
}
}]);
return RefHolder;
}(_react2.default.Component);
RefHolder.propTypes = process.env.NODE_ENV !== "production" ? {
children: _propTypes2.default.node
} : {};
exports.default = RefHolder;

View File

@@ -0,0 +1,20 @@
import React from 'react';
import PropTypes from 'prop-types';
/**
* @ignore - internal component.
*
* Internal helper component to allow attaching a ref to a
* child element that may not accept refs (functional component).
*/
class RefHolder extends React.Component {
render() {
return this.props.children;
}
}
RefHolder.propTypes = {
children: PropTypes.node,
};
export default RefHolder;

View File

@@ -2,11 +2,8 @@ import * as React from 'react';
import { StandardProps } from '..';
import { IconButtonProps } from '../IconButton';
export interface SwitchBaseProps extends StandardProps<
IconButtonProps,
SwitchBaseClassKey,
'onChange'
> {
export interface SwitchBaseProps
extends StandardProps<IconButtonProps, SwitchBaseClassKey, 'onChange'> {
checked?: boolean | string;
checkedClassName?: string;
checkedIcon?: React.ReactNode;
@@ -20,27 +17,19 @@ export interface SwitchBaseProps extends StandardProps<
inputProps?: React.InputHTMLAttributes<HTMLInputElement>;
inputRef?: React.Ref<any>;
name?: string;
onChange?: (event: React.ChangeEvent<{}>, checked: boolean) => void;
onChange?: (event: React.ChangeEvent<HTMLInputElement>, checked: boolean) => void;
tabIndex?: number;
value?: string;
}
export type SwitchBaseClassKey =
| 'root'
| 'default'
| 'checked'
| 'disabled'
| 'input'
;
export type SwitchBaseClassKey = 'root' | 'default' | 'checked' | 'disabled' | 'input';
export type SwitchBase = React.Component<SwitchBaseProps>
export type SwitchBase = React.Component<SwitchBaseProps>;
export interface CreateSwitchBaseOptions {
defaultIcon?: React.ReactNode;
defaultCheckedIcon?: React.ReactNode;
inputType?: string;
type?: string;
}
export default function createSwitch(
options: CreateSwitchBaseOptions
): SwitchBase;
export default function createSwitch(options: CreateSwitchBaseOptions): SwitchBase;

View File

@@ -37,8 +37,6 @@ var _inherits2 = require('babel-runtime/helpers/inherits');
var _inherits3 = _interopRequireDefault(_inherits2);
exports.default = createSwitch;
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
@@ -51,6 +49,14 @@ var _classnames = require('classnames');
var _classnames2 = _interopRequireDefault(_classnames);
var _CheckBoxOutlineBlank = require('../internal/svg-icons/CheckBoxOutlineBlank');
var _CheckBoxOutlineBlank2 = _interopRequireDefault(_CheckBoxOutlineBlank);
var _CheckBox = require('../internal/svg-icons/CheckBox');
var _CheckBox2 = _interopRequireDefault(_CheckBox);
var _withStyles = require('../styles/withStyles');
var _withStyles2 = _interopRequireDefault(_withStyles);
@@ -59,24 +65,8 @@ var _IconButton = require('../IconButton');
var _IconButton2 = _interopRequireDefault(_IconButton);
var _CheckBoxOutlineBlank = require('../svg-icons/CheckBoxOutlineBlank');
var _CheckBoxOutlineBlank2 = _interopRequireDefault(_CheckBoxOutlineBlank);
var _CheckBox = require('../svg-icons/CheckBox');
var _CheckBox2 = _interopRequireDefault(_CheckBox);
var _Icon = require('../Icon');
var _Icon2 = _interopRequireDefault(_Icon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var babelPluginFlowReactPropTypes_proptype_Element = require('react').babelPluginFlowReactPropTypes_proptype_Element || require('prop-types').any;
var babelPluginFlowReactPropTypes_proptype_Node = require('react').babelPluginFlowReactPropTypes_proptype_Node || require('prop-types').any;
var styles = exports.styles = {
root: {
display: 'inline-flex',
@@ -99,261 +89,209 @@ var styles = exports.styles = {
disabled: {}
};
var babelPluginFlowReactPropTypes_proptype_Props = {
/**
* @ignore - internal component.
*/
var SwitchBase = function (_React$Component) {
(0, _inherits3.default)(SwitchBase, _React$Component);
function SwitchBase() {
var _ref;
var _temp, _this, _ret;
(0, _classCallCheck3.default)(this, SwitchBase);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref = SwitchBase.__proto__ || (0, _getPrototypeOf2.default)(SwitchBase)).call.apply(_ref, [this].concat(args))), _this), _this.state = {}, _this.input = null, _this.isControlled = null, _this.handleInputChange = function (event) {
var checked = event.target.checked;
if (!_this.isControlled) {
_this.setState({ checked: checked });
}
if (_this.props.onChange) {
_this.props.onChange(event, checked);
}
}, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
}
(0, _createClass3.default)(SwitchBase, [{
key: 'componentWillMount',
value: function componentWillMount() {
var props = this.props;
this.isControlled = props.checked != null;
if (!this.isControlled) {
// not controlled, use internal state
this.setState({
checked: props.defaultChecked !== undefined ? props.defaultChecked : false
});
}
}
}, {
key: 'render',
value: function render() {
var _classNames;
var _props = this.props,
checkedProp = _props.checked,
checkedIcon = _props.checkedIcon,
classes = _props.classes,
classNameProp = _props.className,
disabledProp = _props.disabled,
iconProp = _props.icon,
id = _props.id,
inputProps = _props.inputProps,
inputRef = _props.inputRef,
name = _props.name,
onChange = _props.onChange,
tabIndex = _props.tabIndex,
type = _props.type,
value = _props.value,
other = (0, _objectWithoutProperties3.default)(_props, ['checked', 'checkedIcon', 'classes', 'className', 'disabled', 'icon', 'id', 'inputProps', 'inputRef', 'name', 'onChange', 'tabIndex', 'type', 'value']);
var muiFormControl = this.context.muiFormControl;
var disabled = disabledProp;
if (muiFormControl) {
if (typeof disabled === 'undefined') {
disabled = muiFormControl.disabled;
}
}
var checked = this.isControlled ? checkedProp : this.state.checked;
var className = (0, _classnames2.default)(classes.root, classes.default, classNameProp, (_classNames = {}, (0, _defineProperty3.default)(_classNames, classes.checked, checked), (0, _defineProperty3.default)(_classNames, classes.disabled, disabled), _classNames));
var icon = checked ? checkedIcon : iconProp;
var hasLabelFor = type === 'checkbox' || type === 'radio';
return _react2.default.createElement(
_IconButton2.default,
(0, _extends3.default)({
component: 'span',
className: className,
disabled: disabled,
tabIndex: null,
role: undefined
}, other),
icon,
_react2.default.createElement('input', (0, _extends3.default)({
id: hasLabelFor && id,
type: type,
name: name,
checked: checked,
onChange: this.handleInputChange,
className: classes.input,
disabled: disabled,
tabIndex: tabIndex,
value: value,
ref: inputRef
}, inputProps))
);
}
}]);
return SwitchBase;
}(_react2.default.Component);
// NB: If changed, please update Checkbox, Switch and Radio
// so that the API documentation is updated.
SwitchBase.propTypes = process.env.NODE_ENV !== "production" ? {
/**
* If `true`, the component is checked.
*/
checked: require('prop-types').oneOfType([require('prop-types').bool, require('prop-types').string]),
/**
* The CSS class name of the root element when checked.
*/
checkedClassName: require('prop-types').string,
checked: _propTypes2.default.oneOfType([_propTypes2.default.bool, _propTypes2.default.string]),
/**
* The icon to display when the component is checked.
* If a string is provided, it will be used as a font ligature.
*/
checkedIcon: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node),
checkedIcon: _propTypes2.default.node,
/**
* Useful to extend the style applied to components.
*/
classes: require('prop-types').object,
classes: _propTypes2.default.object.isRequired,
/**
* @ignore
*/
className: require('prop-types').string,
className: _propTypes2.default.string,
/**
* @ignore
*/
defaultChecked: require('prop-types').bool,
defaultChecked: _propTypes2.default.bool,
/**
* If `true`, the switch will be disabled.
*/
disabled: require('prop-types').bool,
/**
* The CSS class name of the root element when disabled.
*/
disabledClassName: require('prop-types').string,
disabled: _propTypes2.default.bool,
/**
* If `true`, the ripple effect will be disabled.
*/
disableRipple: require('prop-types').bool,
disableRipple: _propTypes2.default.bool,
/**
* The icon to display when the component is unchecked.
* If a string is provided, it will be used as a font ligature.
*/
icon: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node),
icon: _propTypes2.default.node,
/**
* The id of the `input` element.
*/
id: _propTypes2.default.string,
/**
* If `true`, the component appears indeterminate.
*/
indeterminate: require('prop-types').bool,
indeterminate: _propTypes2.default.bool,
/**
* The icon to display when the component is indeterminate.
* If a string is provided, it will be used as a font ligature.
*/
indeterminateIcon: typeof babelPluginFlowReactPropTypes_proptype_Node === 'function' ? babelPluginFlowReactPropTypes_proptype_Node : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Node),
indeterminateIcon: _propTypes2.default.node,
/**
* Properties applied to the `input` element.
*/
inputProps: require('prop-types').object,
inputProps: _propTypes2.default.object,
/**
* Use that property to pass a ref callback to the native input component.
*/
inputRef: require('prop-types').func,
inputRef: _propTypes2.default.func,
/*
* @ignore
*/
name: require('prop-types').string,
name: _propTypes2.default.string,
/**
* Callback fired when the state is changed.
*
* @param {object} event The event source of the callback
* @param {boolean} checked The `checked` value of the switch
*/
onChange: require('prop-types').func,
onChange: _propTypes2.default.func,
/**
* @ignore
*/
tabIndex: require('prop-types').oneOfType([require('prop-types').number, require('prop-types').string]),
tabIndex: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.string]),
/**
* The input component property `type`.
*/
type: _propTypes2.default.string,
/**
* The value of the component.
*/
value: require('prop-types').string
value: _propTypes2.default.string
} : {};
SwitchBase.defaultProps = {
checkedIcon: _react2.default.createElement(_CheckBox2.default, null),
disableRipple: false,
icon: _react2.default.createElement(_CheckBoxOutlineBlank2.default, null),
type: 'checkbox'
};
// NB: If changed, please update Checkbox, Switch and Radio
// so that the API documentation is updated.
var babelPluginFlowReactPropTypes_proptype_Options = {
defaultIcon: typeof babelPluginFlowReactPropTypes_proptype_Element === 'function' ? babelPluginFlowReactPropTypes_proptype_Element.isRequired ? babelPluginFlowReactPropTypes_proptype_Element.isRequired : babelPluginFlowReactPropTypes_proptype_Element : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Element).isRequired,
defaultCheckedIcon: typeof babelPluginFlowReactPropTypes_proptype_Element === 'function' ? babelPluginFlowReactPropTypes_proptype_Element.isRequired ? babelPluginFlowReactPropTypes_proptype_Element.isRequired : babelPluginFlowReactPropTypes_proptype_Element : require('prop-types').shape(babelPluginFlowReactPropTypes_proptype_Element).isRequired,
inputType: require('prop-types').string
SwitchBase.contextTypes = {
muiFormControl: _propTypes2.default.object
};
var _ref2 = _react2.default.createElement(_CheckBoxOutlineBlank2.default, null);
var _ref3 = _react2.default.createElement(_CheckBox2.default, null);
function createSwitch() {
var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
_ref$defaultIcon = _ref.defaultIcon,
defaultIcon = _ref$defaultIcon === undefined ? _ref2 : _ref$defaultIcon,
_ref$defaultCheckedIc = _ref.defaultCheckedIcon,
defaultCheckedIcon = _ref$defaultCheckedIc === undefined ? _ref3 : _ref$defaultCheckedIc,
_ref$inputType = _ref.inputType,
inputType = _ref$inputType === undefined ? 'checkbox' : _ref$inputType;
/**
* @ignore - internal component.
*/
var SwitchBase = function (_React$Component) {
(0, _inherits3.default)(SwitchBase, _React$Component);
function SwitchBase() {
var _ref4;
var _temp, _this, _ret;
(0, _classCallCheck3.default)(this, SwitchBase);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = (0, _possibleConstructorReturn3.default)(this, (_ref4 = SwitchBase.__proto__ || (0, _getPrototypeOf2.default)(SwitchBase)).call.apply(_ref4, [this].concat(args))), _this), _this.state = {}, _this.input = null, _this.button = null, _this.isControlled = null, _this.handleInputChange = function (event) {
var checked = event.target.checked;
if (!_this.isControlled) {
_this.setState({ checked: checked });
}
if (_this.props.onChange) {
_this.props.onChange(event, checked);
}
}, _temp), (0, _possibleConstructorReturn3.default)(_this, _ret);
}
(0, _createClass3.default)(SwitchBase, [{
key: 'componentWillMount',
value: function componentWillMount() {
var props = this.props;
this.isControlled = props.checked !== undefined;
if (!this.isControlled) {
// not controlled, use internal state
this.setState({
checked: props.defaultChecked !== undefined ? props.defaultChecked : false
});
}
}
}, {
key: 'render',
value: function render() {
var _classNames,
_this2 = this;
var _props = this.props,
checkedProp = _props.checked,
classes = _props.classes,
classNameProp = _props.className,
checkedClassName = _props.checkedClassName,
checkedIcon = _props.checkedIcon,
disabledProp = _props.disabled,
disabledClassName = _props.disabledClassName,
iconProp = _props.icon,
inputProps = _props.inputProps,
inputRef = _props.inputRef,
name = _props.name,
onChange = _props.onChange,
tabIndex = _props.tabIndex,
value = _props.value,
other = (0, _objectWithoutProperties3.default)(_props, ['checked', 'classes', 'className', 'checkedClassName', 'checkedIcon', 'disabled', 'disabledClassName', 'icon', 'inputProps', 'inputRef', 'name', 'onChange', 'tabIndex', 'value']);
var muiFormControl = this.context.muiFormControl;
var disabled = disabledProp;
if (muiFormControl) {
if (typeof disabled === 'undefined') {
disabled = muiFormControl.disabled;
}
}
var checked = this.isControlled ? checkedProp : this.state.checked;
var className = (0, _classnames2.default)(classes.root, classes.default, classNameProp, (_classNames = {}, (0, _defineProperty3.default)(_classNames, (0, _classnames2.default)(classes.checked, checkedClassName), checked), (0, _defineProperty3.default)(_classNames, (0, _classnames2.default)(classes.disabled, disabledClassName), disabled), _classNames));
var icon = checked ? checkedIcon : iconProp;
if (typeof icon === 'string') {
icon = _react2.default.createElement(
_Icon2.default,
null,
icon
);
}
return _react2.default.createElement(
_IconButton2.default,
(0, _extends3.default)({
component: 'span',
className: className,
disabled: disabled,
tabIndex: null,
role: undefined,
rootRef: function rootRef(node) {
_this2.button = node;
}
}, other),
icon,
_react2.default.createElement('input', (0, _extends3.default)({
type: inputType,
name: name,
checked: this.isControlled ? checkedProp : undefined,
onChange: this.handleInputChange,
className: classes.input,
disabled: disabled,
tabIndex: tabIndex,
value: value
}, inputProps, {
ref: function ref(node) {
_this2.input = node;
if (inputRef) {
inputRef(node);
}
}
}))
);
}
}]);
return SwitchBase;
}(_react2.default.Component);
SwitchBase.defaultProps = {
checkedIcon: defaultCheckedIcon,
disableRipple: false,
icon: defaultIcon
};
SwitchBase.contextTypes = {
muiFormControl: _propTypes2.default.object
};
return (0, _withStyles2.default)(styles, { name: 'MuiSwitchBase' })(SwitchBase);
}
exports.default = (0, _withStyles2.default)(styles, { name: 'MuiSwitchBase' })(SwitchBase);

View File

@@ -1,14 +1,10 @@
// @flow
import React from 'react';
import type { Node, Element } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import CheckBoxOutlineBlankIcon from '../internal/svg-icons/CheckBoxOutlineBlank';
import CheckBoxIcon from '../internal/svg-icons/CheckBox';
import withStyles from '../styles/withStyles';
import IconButton from '../IconButton';
import CheckBoxOutlineBlankIcon from '../svg-icons/CheckBoxOutlineBlank';
import CheckBoxIcon from '../svg-icons/CheckBox';
import Icon from '../Icon';
export const styles = {
root: {
@@ -32,230 +28,196 @@ export const styles = {
disabled: {},
};
type ProvidedProps = {
classes: Object,
};
/**
* @ignore - internal component.
*/
class SwitchBase extends React.Component {
state = {};
componentWillMount() {
const { props } = this;
this.isControlled = props.checked != null;
if (!this.isControlled) {
// not controlled, use internal state
this.setState({
checked: props.defaultChecked !== undefined ? props.defaultChecked : false,
});
}
}
input = null;
isControlled = null;
handleInputChange = (event: SyntheticInputEvent<*>) => {
const checked = event.target.checked;
if (!this.isControlled) {
this.setState({ checked });
}
if (this.props.onChange) {
this.props.onChange(event, checked);
}
};
render() {
const {
checked: checkedProp,
checkedIcon,
classes,
className: classNameProp,
disabled: disabledProp,
icon: iconProp,
id,
inputProps,
inputRef,
name,
onChange,
tabIndex,
type,
value,
...other
} = this.props;
const { muiFormControl } = this.context;
let disabled = disabledProp;
if (muiFormControl) {
if (typeof disabled === 'undefined') {
disabled = muiFormControl.disabled;
}
}
const checked = this.isControlled ? checkedProp : this.state.checked;
const className = classNames(classes.root, classes.default, classNameProp, {
[classes.checked]: checked,
[classes.disabled]: disabled,
});
const icon = checked ? checkedIcon : iconProp;
const hasLabelFor = type === 'checkbox' || type === 'radio';
return (
<IconButton
data-mui-test="SwitchBase"
component="span"
className={className}
disabled={disabled}
tabIndex={null}
role={undefined}
{...other}
>
{icon}
<input
id={hasLabelFor && id}
type={type}
name={name}
checked={checked}
onChange={this.handleInputChange}
className={classes.input}
disabled={disabled}
tabIndex={tabIndex}
value={value}
ref={inputRef}
{...inputProps}
/>
</IconButton>
);
}
}
// NB: If changed, please update Checkbox, Switch and Radio
// so that the API documentation is updated.
export type Props = {
SwitchBase.propTypes = {
/**
* If `true`, the component is checked.
*/
checked?: boolean | string,
/**
* The CSS class name of the root element when checked.
*/
checkedClassName?: string,
checked: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
/**
* The icon to display when the component is checked.
* If a string is provided, it will be used as a font ligature.
*/
checkedIcon?: Node,
checkedIcon: PropTypes.node,
/**
* Useful to extend the style applied to components.
*/
classes?: Object,
classes: PropTypes.object.isRequired,
/**
* @ignore
*/
className?: string,
className: PropTypes.string,
/**
* @ignore
*/
defaultChecked?: boolean,
defaultChecked: PropTypes.bool,
/**
* If `true`, the switch will be disabled.
*/
disabled?: boolean,
/**
* The CSS class name of the root element when disabled.
*/
disabledClassName?: string,
disabled: PropTypes.bool,
/**
* If `true`, the ripple effect will be disabled.
*/
disableRipple?: boolean,
disableRipple: PropTypes.bool,
/**
* The icon to display when the component is unchecked.
* If a string is provided, it will be used as a font ligature.
*/
icon?: Node,
icon: PropTypes.node,
/**
* The id of the `input` element.
*/
id: PropTypes.string,
/**
* If `true`, the component appears indeterminate.
*/
indeterminate?: boolean,
indeterminate: PropTypes.bool,
/**
* The icon to display when the component is indeterminate.
* If a string is provided, it will be used as a font ligature.
*/
indeterminateIcon?: Node,
indeterminateIcon: PropTypes.node,
/**
* Properties applied to the `input` element.
*/
inputProps?: Object,
inputProps: PropTypes.object,
/**
* Use that property to pass a ref callback to the native input component.
*/
inputRef?: Function,
inputRef: PropTypes.func,
/*
* @ignore
*/
name?: string,
name: PropTypes.string,
/**
* Callback fired when the state is changed.
*
* @param {object} event The event source of the callback
* @param {boolean} checked The `checked` value of the switch
*/
onChange?: Function,
onChange: PropTypes.func,
/**
* @ignore
*/
tabIndex?: number | string,
tabIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
/**
* The input component property `type`.
*/
type: PropTypes.string,
/**
* The value of the component.
*/
value?: string,
value: PropTypes.string,
};
type State = {
checked?: boolean,
SwitchBase.defaultProps = {
checkedIcon: <CheckBoxIcon />,
disableRipple: false,
icon: <CheckBoxOutlineBlankIcon />,
type: 'checkbox',
};
export type Options = {
defaultIcon: Element<*>,
defaultCheckedIcon: Element<*>,
inputType?: string,
SwitchBase.contextTypes = {
muiFormControl: PropTypes.object,
};
export default function createSwitch(
{
defaultIcon = <CheckBoxOutlineBlankIcon />,
defaultCheckedIcon = <CheckBoxIcon />,
inputType = 'checkbox',
}: Options = {},
) {
/**
* @ignore - internal component.
*/
class SwitchBase extends React.Component<ProvidedProps & Props, State> {
static defaultProps = {
checkedIcon: defaultCheckedIcon,
disableRipple: false,
icon: defaultIcon,
};
static contextTypes = {
muiFormControl: PropTypes.object,
};
state = {};
componentWillMount() {
const { props } = this;
this.isControlled = props.checked !== undefined;
if (!this.isControlled) {
// not controlled, use internal state
this.setState({
checked: props.defaultChecked !== undefined ? props.defaultChecked : false,
});
}
}
input = null;
button = null;
isControlled = null;
handleInputChange = (event: SyntheticInputEvent<*>) => {
const checked = event.target.checked;
if (!this.isControlled) {
this.setState({ checked });
}
if (this.props.onChange) {
this.props.onChange(event, checked);
}
};
render() {
const {
checked: checkedProp,
classes,
className: classNameProp,
checkedClassName,
checkedIcon,
disabled: disabledProp,
disabledClassName,
icon: iconProp,
inputProps,
inputRef,
name,
onChange,
tabIndex,
value,
...other
} = this.props;
const { muiFormControl } = this.context;
let disabled = disabledProp;
if (muiFormControl) {
if (typeof disabled === 'undefined') {
disabled = muiFormControl.disabled;
}
}
const checked = this.isControlled ? checkedProp : this.state.checked;
const className = classNames(classes.root, classes.default, classNameProp, {
[classNames(classes.checked, checkedClassName)]: checked,
[classNames(classes.disabled, disabledClassName)]: disabled,
});
let icon = checked ? checkedIcon : iconProp;
if (typeof icon === 'string') {
icon = <Icon>{icon}</Icon>;
}
return (
<IconButton
data-mui-test="SwitchBase"
component="span"
className={className}
disabled={disabled}
tabIndex={null}
role={undefined}
rootRef={node => {
this.button = node;
}}
{...other}
>
{icon}
<input
type={inputType}
name={name}
checked={this.isControlled ? checkedProp : undefined}
onChange={this.handleInputChange}
className={classes.input}
disabled={disabled}
tabIndex={tabIndex}
value={value}
{...inputProps}
ref={node => {
this.input = node;
if (inputRef) {
inputRef(node);
}
}}
/>
</IconButton>
);
}
}
return withStyles(styles, { name: 'MuiSwitchBase' })(SwitchBase);
}
export default withStyles(styles, { name: 'MuiSwitchBase' })(SwitchBase);

View File

@@ -1,17 +0,0 @@
"use strict";
var babelPluginFlowReactPropTypes_proptype_SyntheticUIEventHandler = require("prop-types").func;
var babelPluginFlowReactPropTypes_proptype_DOMNode = require("prop-types").oneOfType([require("prop-types").any, require("prop-types").any]);
/**
* return type of ReactDOM.findDOMNode()
*
* NOTE: `Element` is NOT the same as `type { Element } from 'react'` a.k.a React$Element
*
* To use it as a typical node, check with `if (node instanceof HTMLElement) { ... }`
*/
// Actual flow type:
// export type DOMNode = Element | Text | null;
// Workaround type (results in `any`) due to https://github.com/brigand/babel-plugin-flow-react-proptypes/issues/115

View File

@@ -1,16 +0,0 @@
// @flow
export type SyntheticUIEventHandler = (event?: SyntheticUIEvent<>) => void;
/**
* return type of ReactDOM.findDOMNode()
*
* NOTE: `Element` is NOT the same as `type { Element } from 'react'` a.k.a React$Element
*
* To use it as a typical node, check with `if (node instanceof HTMLElement) { ... }`
*/
// Actual flow type:
// export type DOMNode = Element | Text | null;
// Workaround type (results in `any`) due to https://github.com/brigand/babel-plugin-flow-react-proptypes/issues/115
export type DOMNode = typeof Element | typeof Text | null;

View File

@@ -1,151 +0,0 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _warning = require('warning');
var _warning2 = _interopRequireDefault(_warning);
var _isWindow = require('dom-helpers/query/isWindow');
var _isWindow2 = _interopRequireDefault(_isWindow);
var _ownerDocument = require('dom-helpers/ownerDocument');
var _ownerDocument2 = _interopRequireDefault(_ownerDocument);
var _inDOM = require('dom-helpers/util/inDOM');
var _inDOM2 = _interopRequireDefault(_inDOM);
var _scrollbarSize = require('dom-helpers/util/scrollbarSize');
var _scrollbarSize2 = _interopRequireDefault(_scrollbarSize);
var _manageAriaHidden = require('../utils/manageAriaHidden');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
// Taken from https://github.com/react-bootstrap/react-overlays/blob/master/src/ModalManager.js
function getPaddingRight(node) {
return parseInt(node.style.paddingRight || 0, 10);
}
// Do we have a scroll bar?
function bodyIsOverflowing(node) {
var doc = (0, _ownerDocument2.default)(node);
var win = (0, _isWindow2.default)(doc);
// Takes in account potential non zero margin on the body.
var style = window.getComputedStyle(doc.body);
var marginLeft = parseInt(style.getPropertyValue('margin-left'), 10);
var marginRight = parseInt(style.getPropertyValue('margin-right'), 10);
return marginLeft + doc.body.clientWidth + marginRight < win.innerWidth;
}
// The container shouldn't be used on the server.
var defaultContainer = _inDOM2.default ? window.document.body : {};
/**
* State management helper for modals/layers.
* Simplified, but inspired by react-overlay's ModalManager class
*
* @internal Used by the Modal to ensure proper focus management.
*/
function createModalManager() {
var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
_ref$container = _ref.container,
container = _ref$container === undefined ? defaultContainer : _ref$container,
_ref$hideSiblingNodes = _ref.hideSiblingNodes,
hideSiblingNodes = _ref$hideSiblingNodes === undefined ? true : _ref$hideSiblingNodes;
process.env.NODE_ENV !== "production" ? (0, _warning2.default)(container !== null, '\nMaterial-UI: you are most likely evaluating the code before the\nbrowser has a chance to reach the <body>.\nPlease move the import at the end of the <body>.\n ') : void 0;
var modals = [];
var prevOverflow = void 0;
var prevPaddings = [];
function add(modal) {
var modalIdx = modals.indexOf(modal);
if (modalIdx !== -1) {
return modalIdx;
}
modalIdx = modals.length;
modals.push(modal);
if (hideSiblingNodes) {
(0, _manageAriaHidden.hideSiblings)(container, modal.mountNode);
}
if (modals.length === 1) {
// Save our current overflow so we can revert
// back to it when all modals are closed!
prevOverflow = container.style.overflow;
if (bodyIsOverflowing(container)) {
prevPaddings = [getPaddingRight(container)];
var scrollbarSize = (0, _scrollbarSize2.default)();
container.style.paddingRight = prevPaddings[0] + scrollbarSize + 'px';
var fixedNodes = document.querySelectorAll('.mui-fixed');
for (var i = 0; i < fixedNodes.length; i += 1) {
var paddingRight = getPaddingRight(fixedNodes[i]);
prevPaddings.push(paddingRight);
fixedNodes[i].style.paddingRight = paddingRight + scrollbarSize + 'px';
}
}
container.style.overflow = 'hidden';
}
return modalIdx;
}
function remove(modal) {
var modalIdx = modals.indexOf(modal);
if (modalIdx === -1) {
return modalIdx;
}
modals.splice(modalIdx, 1);
if (modals.length === 0) {
container.style.overflow = prevOverflow;
container.style.paddingRight = prevPaddings[0];
var fixedNodes = document.querySelectorAll('.mui-fixed');
for (var i = 0; i < fixedNodes.length; i += 1) {
fixedNodes[i].style.paddingRight = prevPaddings[i + 1] + 'px';
}
prevOverflow = undefined;
prevPaddings = [];
if (hideSiblingNodes) {
(0, _manageAriaHidden.showSiblings)(container, modal.mountNode);
}
} else if (hideSiblingNodes) {
// otherwise make sure the next top modal is visible to a SR
(0, _manageAriaHidden.ariaHidden)(false, modals[modals.length - 1].mountNode);
}
return modalIdx;
}
function isTopModal(modal) {
return !!modals.length && modals[modals.length - 1] === modal;
}
var modalManager = { add: add, remove: remove, isTopModal: isTopModal };
return modalManager;
}
exports.default = createModalManager;

View File

@@ -1,132 +0,0 @@
// @flow
// Taken from https://github.com/react-bootstrap/react-overlays/blob/master/src/ModalManager.js
import warning from 'warning';
import isWindow from 'dom-helpers/query/isWindow';
import ownerDocument from 'dom-helpers/ownerDocument';
import canUseDom from 'dom-helpers/util/inDOM';
import getScrollbarSize from 'dom-helpers/util/scrollbarSize';
import { hideSiblings, showSiblings, ariaHidden } from '../utils/manageAriaHidden';
function getPaddingRight(node) {
return parseInt(node.style.paddingRight || 0, 10);
}
// Do we have a scroll bar?
function bodyIsOverflowing(node) {
const doc = ownerDocument(node);
const win = isWindow(doc);
// Takes in account potential non zero margin on the body.
const style = window.getComputedStyle(doc.body);
const marginLeft = parseInt(style.getPropertyValue('margin-left'), 10);
const marginRight = parseInt(style.getPropertyValue('margin-right'), 10);
return marginLeft + doc.body.clientWidth + marginRight < win.innerWidth;
}
// The container shouldn't be used on the server.
const defaultContainer = canUseDom ? window.document.body : {};
/**
* State management helper for modals/layers.
* Simplified, but inspired by react-overlay's ModalManager class
*
* @internal Used by the Modal to ensure proper focus management.
*/
function createModalManager(
{ container = defaultContainer, hideSiblingNodes = true }: Object = {},
) {
warning(
container !== null,
`
Material-UI: you are most likely evaluating the code before the
browser has a chance to reach the <body>.
Please move the import at the end of the <body>.
`,
);
const modals = [];
let prevOverflow;
let prevPaddings = [];
function add(modal: Object) {
let modalIdx = modals.indexOf(modal);
if (modalIdx !== -1) {
return modalIdx;
}
modalIdx = modals.length;
modals.push(modal);
if (hideSiblingNodes) {
hideSiblings(container, modal.mountNode);
}
if (modals.length === 1) {
// Save our current overflow so we can revert
// back to it when all modals are closed!
prevOverflow = container.style.overflow;
if (bodyIsOverflowing(container)) {
prevPaddings = [getPaddingRight(container)];
const scrollbarSize = getScrollbarSize();
container.style.paddingRight = `${prevPaddings[0] + scrollbarSize}px`;
const fixedNodes = document.querySelectorAll('.mui-fixed');
for (let i = 0; i < fixedNodes.length; i += 1) {
const paddingRight = getPaddingRight(fixedNodes[i]);
prevPaddings.push(paddingRight);
fixedNodes[i].style.paddingRight = `${paddingRight + scrollbarSize}px`;
}
}
container.style.overflow = 'hidden';
}
return modalIdx;
}
function remove(modal: Object) {
const modalIdx = modals.indexOf(modal);
if (modalIdx === -1) {
return modalIdx;
}
modals.splice(modalIdx, 1);
if (modals.length === 0) {
container.style.overflow = prevOverflow;
container.style.paddingRight = prevPaddings[0];
const fixedNodes = document.querySelectorAll('.mui-fixed');
for (let i = 0; i < fixedNodes.length; i += 1) {
fixedNodes[i].style.paddingRight = `${prevPaddings[i + 1]}px`;
}
prevOverflow = undefined;
prevPaddings = [];
if (hideSiblingNodes) {
showSiblings(container, modal.mountNode);
}
} else if (hideSiblingNodes) {
// otherwise make sure the next top modal is visible to a SR
ariaHidden(false, modals[modals.length - 1].mountNode);
}
return modalIdx;
}
function isTopModal(modal: Object) {
return !!modals.length && modals[modals.length - 1] === modal;
}
const modalManager = { add, remove, isTopModal };
return modalManager;
}
export default createModalManager;

View File

@@ -0,0 +1,37 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _pure = require('recompose/pure');
var _pure2 = _interopRequireDefault(_pure);
var _SvgIcon = require('../../SvgIcon');
var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
* @ignore - internal component.
*/
var _ref = _react2.default.createElement('path', { d: 'M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z' });
var ArrowDownward = function ArrowDownward(props) {
return _react2.default.createElement(
_SvgIcon2.default,
props,
_ref
);
};
ArrowDownward = (0, _pure2.default)(ArrowDownward);
ArrowDownward.muiName = 'SvgIcon';
exports.default = ArrowDownward;

View File

@@ -0,0 +1,17 @@
import React from 'react';
import pure from 'recompose/pure';
import SvgIcon from '../../SvgIcon';
/**
* @ignore - internal component.
*/
let ArrowDownward = props => (
<SvgIcon {...props}>
<path d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z" />
</SvgIcon>
);
ArrowDownward = pure(ArrowDownward);
ArrowDownward.muiName = 'SvgIcon';
export default ArrowDownward;

View File

@@ -0,0 +1,37 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _pure = require('recompose/pure');
var _pure2 = _interopRequireDefault(_pure);
var _SvgIcon = require('../../SvgIcon');
var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
* @ignore - internal component.
*/
var _ref = _react2.default.createElement('path', { d: 'M7 10l5 5 5-5z' });
var ArrowDropDown = function ArrowDropDown(props) {
return _react2.default.createElement(
_SvgIcon2.default,
props,
_ref
);
};
ArrowDropDown = (0, _pure2.default)(ArrowDropDown);
ArrowDropDown.muiName = 'SvgIcon';
exports.default = ArrowDropDown;

View File

@@ -0,0 +1,17 @@
import React from 'react';
import pure from 'recompose/pure';
import SvgIcon from '../../SvgIcon';
/**
* @ignore - internal component.
*/
let ArrowDropDown = props => (
<SvgIcon {...props}>
<path d="M7 10l5 5 5-5z" />
</SvgIcon>
);
ArrowDropDown = pure(ArrowDropDown);
ArrowDropDown.muiName = 'SvgIcon';
export default ArrowDropDown;

View File

@@ -0,0 +1,36 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _pure = require('recompose/pure');
var _pure2 = _interopRequireDefault(_pure);
var _SvgIcon = require('../../SvgIcon');
var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
* @ignore - internal component.
*/
var _ref = _react2.default.createElement('path', { d: 'M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z' });
var Cancel = function Cancel(props) {
return _react2.default.createElement(
_SvgIcon2.default,
props,
_ref
);
};
Cancel = (0, _pure2.default)(Cancel);
Cancel.muiName = 'SvgIcon';
exports.default = Cancel;

View File

@@ -0,0 +1,16 @@
import React from 'react';
import pure from 'recompose/pure';
import SvgIcon from '../../SvgIcon';
/**
* @ignore - internal component.
*/
let Cancel = props => (
<SvgIcon {...props}>
<path d="M12 2C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2zm5 13.59L15.59 17 12 13.41 8.41 17 7 15.59 10.59 12 7 8.41 8.41 7 12 10.59 15.59 7 17 8.41 13.41 12 17 15.59z" />
</SvgIcon>
);
Cancel = pure(Cancel);
Cancel.muiName = 'SvgIcon';
export default Cancel;

View File

@@ -0,0 +1,36 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _pure = require('recompose/pure');
var _pure2 = _interopRequireDefault(_pure);
var _SvgIcon = require('../../SvgIcon');
var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
* @ignore - internal component.
*/
var _ref = _react2.default.createElement('path', { d: 'M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z' });
var CheckBox = function CheckBox(props) {
return _react2.default.createElement(
_SvgIcon2.default,
props,
_ref
);
};
CheckBox = (0, _pure2.default)(CheckBox);
CheckBox.muiName = 'SvgIcon';
exports.default = CheckBox;

View File

@@ -0,0 +1,16 @@
import React from 'react';
import pure from 'recompose/pure';
import SvgIcon from '../../SvgIcon';
/**
* @ignore - internal component.
*/
let CheckBox = props => (
<SvgIcon {...props}>
<path d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z" />
</SvgIcon>
);
CheckBox = pure(CheckBox);
CheckBox.muiName = 'SvgIcon';
export default CheckBox;

View File

@@ -0,0 +1,36 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _pure = require('recompose/pure');
var _pure2 = _interopRequireDefault(_pure);
var _SvgIcon = require('../../SvgIcon');
var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
* @ignore - internal component.
*/
var _ref = _react2.default.createElement('path', { d: 'M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z' });
var CheckBoxOutlineBlank = function CheckBoxOutlineBlank(props) {
return _react2.default.createElement(
_SvgIcon2.default,
props,
_ref
);
};
CheckBoxOutlineBlank = (0, _pure2.default)(CheckBoxOutlineBlank);
CheckBoxOutlineBlank.muiName = 'SvgIcon';
exports.default = CheckBoxOutlineBlank;

View File

@@ -0,0 +1,16 @@
import React from 'react';
import pure from 'recompose/pure';
import SvgIcon from '../../SvgIcon';
/**
* @ignore - internal component.
*/
let CheckBoxOutlineBlank = props => (
<SvgIcon {...props}>
<path d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z" />
</SvgIcon>
);
CheckBoxOutlineBlank = pure(CheckBoxOutlineBlank);
CheckBoxOutlineBlank.muiName = 'SvgIcon';
export default CheckBoxOutlineBlank;

View File

@@ -0,0 +1,36 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _pure = require('recompose/pure');
var _pure2 = _interopRequireDefault(_pure);
var _SvgIcon = require('../../SvgIcon');
var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
* @ignore - internal component.
*/
var _ref = _react2.default.createElement('path', { d: 'M12 0a12 12 0 1 0 0 24 12 12 0 0 0 0-24zm-2 17l-5-5 1.4-1.4 3.6 3.6 7.6-7.6L19 8l-9 9z' });
var CheckCircle = function CheckCircle(props) {
return _react2.default.createElement(
_SvgIcon2.default,
props,
_ref
);
};
CheckCircle = (0, _pure2.default)(CheckCircle);
CheckCircle.muiName = 'SvgIcon';
exports.default = CheckCircle;

View File

@@ -0,0 +1,16 @@
import React from 'react';
import pure from 'recompose/pure';
import SvgIcon from '../../SvgIcon';
/**
* @ignore - internal component.
*/
let CheckCircle = props => (
<SvgIcon {...props}>
<path d="M12 0a12 12 0 1 0 0 24 12 12 0 0 0 0-24zm-2 17l-5-5 1.4-1.4 3.6 3.6 7.6-7.6L19 8l-9 9z" />
</SvgIcon>
);
CheckCircle = pure(CheckCircle);
CheckCircle.muiName = 'SvgIcon';
export default CheckCircle;

View File

@@ -0,0 +1,36 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _pure = require('recompose/pure');
var _pure2 = _interopRequireDefault(_pure);
var _SvgIcon = require('../../SvgIcon');
var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
* @ignore - internal component.
*/
var _ref = _react2.default.createElement('path', { d: 'M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10H7v-2h10v2z' });
var IndeterminateCheckBox = function IndeterminateCheckBox(props) {
return _react2.default.createElement(
_SvgIcon2.default,
props,
_ref
);
};
IndeterminateCheckBox = (0, _pure2.default)(IndeterminateCheckBox);
IndeterminateCheckBox.muiName = 'SvgIcon';
exports.default = IndeterminateCheckBox;

View File

@@ -0,0 +1,16 @@
import React from 'react';
import pure from 'recompose/pure';
import SvgIcon from '../../SvgIcon';
/**
* @ignore - internal component.
*/
let IndeterminateCheckBox = props => (
<SvgIcon {...props}>
<path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-2 10H7v-2h10v2z" />
</SvgIcon>
);
IndeterminateCheckBox = pure(IndeterminateCheckBox);
IndeterminateCheckBox.muiName = 'SvgIcon';
export default IndeterminateCheckBox;

View File

@@ -0,0 +1,36 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _pure = require('recompose/pure');
var _pure2 = _interopRequireDefault(_pure);
var _SvgIcon = require('../../SvgIcon');
var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
* @ignore - internal component.
*/
var _ref = _react2.default.createElement('path', { d: 'M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z' });
var KeyboardArrowLeft = function KeyboardArrowLeft(props) {
return _react2.default.createElement(
_SvgIcon2.default,
props,
_ref
);
};
KeyboardArrowLeft = (0, _pure2.default)(KeyboardArrowLeft);
KeyboardArrowLeft.muiName = 'SvgIcon';
exports.default = KeyboardArrowLeft;

View File

@@ -0,0 +1,16 @@
import React from 'react';
import pure from 'recompose/pure';
import SvgIcon from '../../SvgIcon';
/**
* @ignore - internal component.
*/
let KeyboardArrowLeft = props => (
<SvgIcon {...props}>
<path d="M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z" />
</SvgIcon>
);
KeyboardArrowLeft = pure(KeyboardArrowLeft);
KeyboardArrowLeft.muiName = 'SvgIcon';
export default KeyboardArrowLeft;

View File

@@ -0,0 +1,36 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _pure = require('recompose/pure');
var _pure2 = _interopRequireDefault(_pure);
var _SvgIcon = require('../../SvgIcon');
var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
* @ignore - internal component.
*/
var _ref = _react2.default.createElement('path', { d: 'M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z' });
var KeyboardArrowRight = function KeyboardArrowRight(props) {
return _react2.default.createElement(
_SvgIcon2.default,
props,
_ref
);
};
KeyboardArrowRight = (0, _pure2.default)(KeyboardArrowRight);
KeyboardArrowRight.muiName = 'SvgIcon';
exports.default = KeyboardArrowRight;

View File

@@ -0,0 +1,16 @@
import React from 'react';
import pure from 'recompose/pure';
import SvgIcon from '../../SvgIcon';
/**
* @ignore - internal component.
*/
let KeyboardArrowRight = props => (
<SvgIcon {...props}>
<path d="M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z" />
</SvgIcon>
);
KeyboardArrowRight = pure(KeyboardArrowRight);
KeyboardArrowRight.muiName = 'SvgIcon';
export default KeyboardArrowRight;

View File

@@ -0,0 +1,36 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _pure = require('recompose/pure');
var _pure2 = _interopRequireDefault(_pure);
var _SvgIcon = require('../../SvgIcon');
var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
* @ignore - internal component.
*/
var _ref = _react2.default.createElement('path', { d: 'M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z' });
var RadioButtonChecked = function RadioButtonChecked(props) {
return _react2.default.createElement(
_SvgIcon2.default,
props,
_ref
);
};
RadioButtonChecked = (0, _pure2.default)(RadioButtonChecked);
RadioButtonChecked.muiName = 'SvgIcon';
exports.default = RadioButtonChecked;

View File

@@ -0,0 +1,16 @@
import React from 'react';
import pure from 'recompose/pure';
import SvgIcon from '../../SvgIcon';
/**
* @ignore - internal component.
*/
let RadioButtonChecked = props => (
<SvgIcon {...props}>
<path d="M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5 5-2.24 5-5-2.24-5-5-5zm0-5C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z" />
</SvgIcon>
);
RadioButtonChecked = pure(RadioButtonChecked);
RadioButtonChecked.muiName = 'SvgIcon';
export default RadioButtonChecked;

View File

@@ -0,0 +1,36 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _pure = require('recompose/pure');
var _pure2 = _interopRequireDefault(_pure);
var _SvgIcon = require('../../SvgIcon');
var _SvgIcon2 = _interopRequireDefault(_SvgIcon);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
* @ignore - internal component.
*/
var _ref = _react2.default.createElement('path', { d: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z' });
var RadioButtonUnchecked = function RadioButtonUnchecked(props) {
return _react2.default.createElement(
_SvgIcon2.default,
props,
_ref
);
};
RadioButtonUnchecked = (0, _pure2.default)(RadioButtonUnchecked);
RadioButtonUnchecked.muiName = 'SvgIcon';
exports.default = RadioButtonUnchecked;

View File

@@ -0,0 +1,16 @@
import React from 'react';
import pure from 'recompose/pure';
import SvgIcon from '../../SvgIcon';
/**
* @ignore - internal component.
*/
let RadioButtonUnchecked = props => (
<SvgIcon {...props}>
<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z" />
</SvgIcon>
);
RadioButtonUnchecked = pure(RadioButtonUnchecked);
RadioButtonUnchecked.muiName = 'SvgIcon';
export default RadioButtonUnchecked;

View File

@@ -1,21 +0,0 @@
import * as React from 'react';
export type TransitionDuration = number | { enter: number, exit: number };
export type TransitionCallback = (element: HTMLElement) => void;
export type TransitionHandlers = {
onEnter: TransitionCallback;
onEntering: TransitionCallback;
onEntered: TransitionCallback;
onExit: TransitionCallback;
onExiting: TransitionCallback;
onExited: TransitionCallback;
};
export interface TransitionProps extends Partial<TransitionHandlers> {
children: React.ReactElement<any>;
className?: string;
in: boolean;
appear?: boolean;
unmountOnExit?: boolean;
}

View File

@@ -1,17 +0,0 @@
"use strict";
var babelPluginFlowReactPropTypes_proptype_TransitionDuration = require("prop-types").oneOfType([require("prop-types").number, require("prop-types").shape({
enter: require("prop-types").number.isRequired,
exit: require("prop-types").number.isRequired
})]);
var babelPluginFlowReactPropTypes_proptype_TransitionCallback = require("prop-types").func;
var babelPluginFlowReactPropTypes_proptype_TransitionClasses = {
appear: require("prop-types").string,
appearActive: require("prop-types").string,
enter: require("prop-types").string,
enterActive: require("prop-types").string,
exit: require("prop-types").string,
exitActive: require("prop-types").string
};

View File

@@ -1,12 +0,0 @@
// @flow
export type TransitionDuration = number | { enter: number, exit: number };
export type TransitionCallback = (element: HTMLElement) => void;
export type TransitionClasses = {
appear?: string,
appearActive?: string,
enter?: string,
enterActive?: string,
exit?: string,
exitActive?: string,
};