@6thquake/react-material
Version:
React components that implement Google's Material Design.
149 lines (114 loc) • 4.08 kB
JavaScript
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _react = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _withStyles = _interopRequireDefault(require("../styles/withStyles"));
var _Snackbar = _interopRequireDefault(require("../Snackbar"));
var _transitions = require("../transitions");
var styles = function styles(theme) {
return {
snackbar: {
margin: theme.spacing(1)
}
};
};
var Message =
/*#__PURE__*/
function (_Component) {
(0, _inherits2.default)(Message, _Component);
function Message() {
var _getPrototypeOf2;
var _this;
(0, _classCallCheck2.default)(this, Message);
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
_this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(Message)).call.apply(_getPrototypeOf2, [this].concat(args)));
_this._transition = function (props) {
switch (_this.props.animation) {
case 'fade':
return _react.default.createElement(_transitions.Fade, props);
break;
case 'slide':
return _react.default.createElement(_transitions.Slide, (0, _extends2.default)({
direction: "up"
}, props));
break;
case 'collapse':
return _react.default.createElement(_transitions.Collapse, props);
break;
case 'grow':
return _react.default.createElement(_transitions.Grow, props);
break;
case 'zoom':
return _react.default.createElement(_transitions.Zoom, props);
break;
default:
return _react.default.createElement(_transitions.Fade, props);
}
};
return _this;
}
(0, _createClass2.default)(Message, [{
key: "render",
value: function render() {
var _this$props = this.props,
open = _this$props.open,
action = _this$props.action,
onClose = _this$props.onClose,
anchorOrigin = _this$props.anchorOrigin,
classes = _this$props.classes;
return _react.default.createElement(_Snackbar.default, (0, _extends2.default)({}, classes, {
TransitionComponent: this._transition,
open: open,
anchorOrigin: anchorOrigin,
onClose: onClose,
message: this.props.children,
action: action
}));
}
}]);
return Message;
}(_react.Component);
Message.propTypes = {
/**
* This is usually about message action
*/
action: _propTypes.default.element,
/**
* The anchor of the Message.
*/
anchorOrigin: _propTypes.default.object,
/**
* This is usually an animation of open or close the message,include slide、collapse、fade、grow、zoom
*/
animation: _propTypes.default.string,
/**
* This is usually about message open or close
*/
open: _propTypes.default.bool.isRequired
};
Message.defaultProps = {
open: false,
animation: 'fade',
action: null,
anchorOrigin: {
vertical: 'bottom',
horizontal: 'center'
}
};
var _default = (0, _withStyles.default)(styles, {
name: 'RMMessage'
})(Message);
exports.default = _default;